關於移動端--適配

1 爲何要適配？

     要實現等比；

默認狀況等不等比？不加meta標籤是等比的

加了meta標籤就不等比了。

<metaname="viewport"content="width=device-width,

initial-scale=1.0,user-scalable=no"/>

2 rem適配的本質：rem參照根元素字體（html字體）

  無論視圖多大，在不一樣的移動端機型上，1rem等於視圖的寬度，因此，根標籤的font-size改爲佈局視口的大小。

3 viewpoint適配的本質：UI給的320px圖紙（頁面），讓全部設備的佈局視口變爲320px,動態改變initial-scale的比值。

4.rem適配

優勢：能夠使用理想標籤，

   能夠實現等比縮放

缺點：換算比較麻煩

    核心思想：基於rem

5.viewport適配

優勢：避免複雜的計算，直接使用UI的標準像素值

缺點：不能使用理想視口

  圖片失真狀況很嚴重

6.1px像素(1物理像素)實現原理

讓全部佈局元素（div）都爲rem單位，邊框爲px單位

讓頁面中全部元素都縮小一半，讓佈局(div)元素rem*2

這樣 1px  css像素就變成了1px的物理像素.