#webkit 處理webkit核心就行
視口（viewport）：meta視口標籤的目的：可以讓裝置有多寬我們布局的視口就多寬
ps切圖：cutterman可以直接切幾倍圖，
布局方案：.單獨移動頁面，包括：流式布局（百分比布局）寬度設定百分比，高度設定固定，可以設定最小最大縮放距離，max-width。min-width
、flex彈性布局、less+rem+**查詢布局、混合布局。
響應式頁面（通過判斷螢幕來縮放）包括：**查詢、bootstarp
移動端初始化 normalize.css
css3盒子模型（box-sizing=border-box）：相比傳統新增margin盒子會變大，要手動減少。而在css3中可以通過box-sizing=border-box；讓他無論新增什麼盒子大小都不會改變，為css3新加的，老版本瀏覽器不支援。移動端全用c3盒子模型。主要用於外層盒子百分比
移動端布局：不像pc那樣有版心。
百分比布局：寬度設定百分比，寬度要設定，為了防止拉伸過度設定max-width、min最大最小寬度。
10.二倍精靈圖：先把精靈圖縮放一半，定位用縮放後的座標，bgc-size：原縮放一半 auto；
flex彈性布局
通過給父元素新增flex，來控制子元素排放位置。
父元素屬性：flex-direction：設定主軸方向；justify-content：設定主軸上子元素排列的方式；flex-wrap：設定子元素是否換行；align-content：設定側軸上的子元素垂直排列方式(多行）；align-items：設定側軸上的子元素排列方式（單行）；flex-flow：復合屬性，相當於同時設定了flex-direction和flex-wrap；
子元素屬性：flex：數字，劃分剩餘空間。數字代表占用幾份 。order：數字，可以把第二個提前到第乙個（數值越小越提前預設0） 、 align-self：flex-end；控制子元素在側軸上的排序。
多數用於移動端
父元素設定
display：flex
最好順便設定min-width最小寬度
flex-direction：column；可以把左到右排列變成上到下排
子元素flex：1/2/3（把父元素內容劃分）相對於width33.3%來說，省略了寬度、浮動、以及設定33.3%後不能設定margin之類的屬性
justify-content：space-around相當於給盒子新增相同的左右外邊距離，用於水平居中
align-items:stretch;用於垂直居中 針對一行
align-content:center；垂直居中 此方法針對多行。其必須對父元素設定display：flex；
排列方式為橫向排列flex-flow：row wrap；（必須有要不然不顯示）
移動端布局
預設以寬度為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...