关于相对字体大小rem的使用

我在这里只是说具体的用法，在HTML页面使用rem单位，首先设置一个页面的基本字号的字体，这个字号最好设置在HTML便签里，如下：
html {
   -ms-text-size-adjust: 100%;
   -webkit-text-size-adjust: 100%;
}

html{

font-size: 62.5%;/*font-size:10px;  这是覆盖浏览默认字体进而设置基准字体大小*/

-webkit-tap-highlight-color: transparent;

}
body {
    font-size: 1.6rem;
    line-height:1.6;
}
我就以提问题的方式说说关于单位在移动页面中的一些常识

为什么设置text-size-adjust：100%；？

iPhone 和 Android 的浏览器纵向 (Portrate mode) 和橫向 (Landscape mode) 模式皆有自动调整字体大小的功能。控制它的就是 CSS 中的 -webkit-text-size-adjust。

text-size-adjust 设为 none 或者 100% 关闭字体大小自动调整功能.

为什么设置font-size: 62.5%;？

这是将浏览器的基准字号设置为 62.5%，也就是 10px，现在 1rem = 10px —— 为了计算方便。然后在body 上应用了 font-size: 1.6rem;，将页面字号设置为 16px。当然并不是所有浏览器的默认字号都是16px;

rem 和 em 有什么区别？

与 em 根据上下文变化不同，rem 只跟基准设置关联，只要修改基准字号，所有使用 rem 作为单位的设置都会相应改变。

 

最后在使用过程中应该视情况而定，一些需要根据字号做相应变化的场景也使用了 em，需要像素级别精确的场景也使用了 px。

在这里提供一个px,em,rem单位转换工具

http://pxtoem.com/

转载于:https://www.cnblogs.com/wjh0916/p/4708323.html