CSS3中的rem适配

今天学习了一下，在移动设备写页面，发现用em和px字体不能很好的适配各个设备，于是在网上搜了一下现在都用rem，所以就学习了一下。

首先要先说一下他的原理：

em 会继承父级元素的字体大小

rem 会继承HTML根节点的大小

所以我们先用js获得各个移动设备的html字体进行设置，这样全局的字体都会继承html的根节点字体。

       <script>
document.getElementsByTagName("html")[0].style.fontSize=
document.documentElement.clientWidth/20+"px";
      </script>

<div class="sun" style="font-size=1rem">
晴天——Jay
</div>

这样.sun的字体大小就会自动适配各个移动设备来自动变化字体大小