关于移动端--适配

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的物理像素.