h5 网页自适应要点,rem和px的转换

由于手机尺寸不一，想要网页自适应不同的屏幕尺寸，就要为网页添加配置代码

首先添加meta标签

<meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1, minimum-scale=1, user-scalable=no,uc-fitscreen=yes">

width=device-width：是设置可视区宽度等于设备宽度

initial-scale：设置页面的初始缩放值

maximum-scale：允许用户的最大缩放值

minimum-scale：允许用户的最小缩放值

user-scalable：是否允许用户缩放，yes为允许，no为不允许

uc-fitscreen：适配UC

关于字体的设置

分割线

浏览器默认字号是16px,那么px和rem之间的转换关系是什么呢，1rem=16px，所以如何使我们开发的时候方便使用rem来进行响应式的开发呢，因为rem是相对于根元素计算的，14px的值转换成rem之后是14/16rem，这样我们在开发的时候会做大量的计算比较麻烦。所以我们一般采用通过设置根节点的font-size=62.5% ，这样的话我们看设计稿的时候直接把px单位改成rem 然后在把数值除以10就可以了。

例如：

html { font-size:"62.5%" }

div{

font-size:1.4rem

}

1.4rem = 14px