1.純粹的移動端逐抑，不需要考慮任何的pc上的效果
? ? ? ? ? ?a.百分比? 不推薦使用
? ? ? ? ? ?b.rem? (推薦)
? ? ? ? ? ?c.viewpoint? (推薦)
? ? ? ? ? ?d.無寬布局(不是說永遠(yuǎn)的不給寬度)
2.響應(yīng)式(一套網(wǎng)站，兼容N多設(shè)配)
1-c viewport? 視窗? 可視區(qū)尺寸
? ? ? 在沒有使用meta的時候献丑，頁面在放入到手機(jī)屏幕中展示，整個頁面會縮小侠姑，但是如果使用了meta頁面會按照正常的樣式展示创橄；
? ? ? <meta name="viewport" content="width=device-width, initial-scale=1.0">
? ? ? width 可視區(qū)域的寬度? 固定尺寸(不需要px)/device-width；實(shí)際中只寫640
? ? ? height 可視區(qū)域的高度? 固定尺寸/device-height ? 實(shí)際一般不寫
? ? ? initial-scale? 初始縮放比例? 莽红； 實(shí)際一般是.5859375
? ? ? maximun-scale? 最大縮放比例妥畏； 實(shí)際一般是.5859375
? ? minimun-scale? 最小縮放比例； 實(shí)際一般是.5859375
? ? ? user-saclable? 用戶縮放比例 ?安吁；實(shí)際只寫no
? ? 根據(jù)以上：在實(shí)際頁面中<meta id="viewport" name="viewport" content="width=640,initial-scale=.5859375,maximum-scale=.5859375,minimum-scale=.5859375,user-scalable=no">,css中的代碼尺寸按照實(shí)際圖寫醉蚁，設(shè)計圖給出多少px就是多少px，在手機(jī)端中就會實(shí)現(xiàn)自動布局鬼店，不需要使用任何的百分比网棍；
? ?ios專用的：
? ? ? ?iso 9001? 是一個標(biāo)準(zhǔn),類似utf-8這種類型的標(biāo)準(zhǔn)
? ? ? ?ios：蘋果的系統(tǒng)
? ? ? 添加到主屏
? ? ? ? ? ?<meta name="apple-mobile-web-app-title" content="添加到主屏">?
? ? ? ? ? <meta name="apple-touch-icon-precomposed" content="a.png">
? ? ? ?是否進(jìn)入web app全屏模式 ??
? ? ? ? ? <meta name="apple-mobile-web-app-capable" content="yes">
? ? ? ?禁止將數(shù)字識別為電話號碼
? ? ? ? <meta name="format-detection" content="telephone=no">
? ? ? -webkit-text-size-adjust: none;? 將自動字號調(diào)整禁用
1-a ?rem布局
? ? ? ?rem布局不要使用viewport布局中用到的內(nèi)容mate；rem的大小是根據(jù)實(shí)際設(shè)計圖中的尺寸進(jìn)行計算的妇智；計算方式如下：
? ? ? ch =? document.documentElement.clientWidth滥玷；屏幕實(shí)際寬度
? ? ? ?font-size = ch/每份大小 = 份數(shù)? (每份大小 一般都是按照40去計算氏身，有興趣的可以去了解一下，這里不詳細(xì)說明)
一般的默認(rèn)比值是16惑畴；如：在440設(shè)計圖給出100px高度蛋欣，那么在css代碼中height:100px/16=6.25rem?
該方式的布局的適配比viewport更為全面一點(diǎn)，但是viewport跟簡單一點(diǎn)如贷；實(shí)際選擇根據(jù)項(xiàng)目需要豁状；
