pc適配

  1. 圖片寬度百分比,高度自動
  2. 字體行高不寫單位,按當前字體的倍數(shù)寫
  3. 合理設(shè)置媒體查詢的斷點(以及斷點之間可能可以換算的比例)
    斷點參考網(wǎng)站 ↓↓↓
    Nixon:
    @media screen and (min-width: 768px)
    @media screen and (min-width: 1024px) 780px;

Evolution Fresh:
@media (min-width: 768px)
@media screen and (min-width: 992px)

BigDrop:
@media (min-width: 568px)
@media (min-width: 768px)
@media (min-width: 1024px)
@media (min-width: 1200px)

Buffalo:
@media only screen and (min-width: 721px)
@media screen and (min-width: 961px)
@media only screen and (min-width: 1601px) and (min-width: 960px)

Sparkbox:
@media (min-width: 38em)
計算某個最小高度使用vh+em

  1. 使用vw和vh
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽?zāi)J的外補...
    _Yfling閱讀 14,192評論 1 92
  • CSS 是什么 css(Cascading Style Sheets),層疊樣式表,選擇器{屬性:值;屬性:值}h...
    崔敏嫣閱讀 1,580評論 0 5
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML標準。 注意:講述HT...
    kismetajun閱讀 28,878評論 1 45
  • 剛開始做移動端web開發(fā)的同學應(yīng)該都碰到過頁面適配問題,為什么我在開發(fā)手機上調(diào)試好的頁面在其他手機會有這樣或那樣的...
    留七七閱讀 19,788評論 5 80
  • 1、屬性選擇器:id選擇器 # 通過id 來選擇類名選擇器 . 通過類名來選擇屬性選擇器 ...
    Yuann閱讀 1,769評論 0 7

友情鏈接更多精彩內(nèi)容