今天看到了一个没见过的单位vw,就顺便把css中我常用的单位讲解一下；
1.px
px:像素，这个单位想必大家都很熟悉，就是计算机上的一个点，我也不多说什么了。
2.em
em是相对于其父元素的字体大小，如果没有父元素，则是相对于body元素，即1em是当前元素大小的1倍，2em是2倍。
<div style="font-size:12" >
<p style="font-size:12">12px大小</p>
<p style="font-size:1em">1em大小</p> ==>两个p的字体大小是一样的
</div>
3.rem
rem是相对于根元素的大小，即html元素，rem一般用来做移动端的适配，我们可以有两种方法来使用rem
1.在css中给html元素设置fong-size大小为625%，然后再取得设计图中的像素大小后，在除以100就是rem的值；
<style>
html{
font-size: 625%;
}
</style>
<div style="font-size: 100;">
<p style="font-size: 100px;">硕大的</p>
<p style="font-size: 1rem;">硕大的</p>
</div>
2.是根据设计图的大小，通过js设置根元素的font-size
document.documentElement.style.fontSize = document.documentElement.clientWidth/6.4 + "px";
其中6.4是根据设计图的横向大小决定的，若是基于ipone7的设计稿，那就是除以7.5，之后取得设计图的像素大小后，除以100就是rem的值。
4.vw
vw视口宽度，也是用来做移动端的弹性布局的单位，但基本上用不到，我也是今天才看到有这个。其原理是设备将视口平均分为100单位的vw
在pc的可视区是1280px，那1vw就是12.8px，所以说，在做移动端布局时，根据设计图宽度，若是750px，则将取得的像素大小乘以100在除以750，即直接除以7.5，得到的就是vw的值，用法和rem差不多
