移動端頁面基本上和web端區別不大 但要考慮到 移動端螢幕尺寸不大並且都是全屏布局 而且 螢幕尺寸都不一樣 所有不能使用網頁的固定尺寸來布局 需要使用百分比來布局
優點：移動端基本都相容h5 css3 所有可以放心的去使用css3的樣式來布局
移動端頁面一般都不大 所以標籤使用的並不多 相對乙個一面開發時間沒web端長
缺點移動端寬高尺寸不同 因此測量尺寸成為了乙個難題 無法非常精確的寫尺寸
新單位 rem
rem是永遠獲取html的font-size值
然後通過js獲取螢幕尺寸 制定出乙個係數 去改變html的font-size值
w,vh 永遠獲取螢幕寬高
100vw=螢幕的寬度
1vw=1%螢幕尺寸
這樣更直觀的獲取百分比 但是少部分手機不支援 所以需要自己把控
要移動端尺寸顯示正常需要加上以下meta
移動端布局
預設以寬度為640px的設計稿為基準頁面，然後通過js獲取當前顯示裝置的尺寸，對應的調整 html 標籤的font size大小，從而實現通過以rem為單位的移動端布局適配。function win,doc function layoutcalc html.style.fontsize rem px...
移動端布局
css畫素與裝置畫素 二者的區別在於前者是抽象的，用於瀏覽器渲染頁面，而後者是裝置的最小物理單位。可參考 a pixel is not a pixel is not a pixel 進行理解。視口 移動端瀏覽器有兩個視口，即可見視口與布局視口，二者的區別在於前者為基於移動裝置螢幕的實際寬度，而後者為...
移動端布局
瀏覽器上 用來顯示網頁的那部分區域了 1 設定 view 有 init scale 頁面的初始縮放值 為數字 width viewport的寬度 height viewport的高度 mininum scale 允許使用者縮放最小值 maxinum scale 允許使用者縮放最大值 user sca...