1.rem与em的区别
em 是一个参照自身字体的是一个单位，先去找自身的字体大小，如果自身没有字体大小，找父元素；rem是一个参照html字体大小的一个单位。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
html {
font-size: 20px;
}
.box {
font-size: 10px;
}
span {
font-size: 2rem; /*font-size: 2em;*/
width: 2rem; /*width: 2em;*/
display: block;
}
</style>
</head>
<body>
<div class="box">
<span>say lalalalalalalala</span>
</div>
</body>
</html>上述代码中，当span的font-size和width的单位是rem时，参照的是html字体大小，故其值为2*20px；当span的font-size和width的单位是em时，参照的是父元素box字体大小，故其值为2*10px。
2.rem的js算法
比例公式：设计图的宽度/自己针对这个设计自定义的font值 = 不断变化的屏幕宽度/这个屏幕对应的font值；
版权声明：本文为yawhom原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。