弹性布局一般使用em和%为单位，但是他们的属性和相对值却完全不一样。
首先是em字体高，继承父元素字体大小，但是本元素大部分数值属性（width，height，line-height，margin，border，padding等）都是参照本身字体大小。例如父元素font-size：1em=10px，子元素font-size：2em=20px，而子元素width：2em=40px。
一个小例子代码如下：
body {
font:62.5%/2em Microsoft YaHei, Arial, Tahoma, Helvetica, SimSun, san-serif;
height:100%;
position:relative;
text-align:center;
background:#A5CEEF;
}
.divEm{ width:10em; height:10em; border:1em solid #000; background-color:#999; font-size:1em;}
.div2Em{ width:2em; height:2em; border:1em solid #000; background-color:#666; font-size:2em; margin:1em; padding:1em}
<div class="divEm">dieEm测试
<div class="div2Em">die2Em测试</div>
</div>
- 转换成px值即divEm：font-size=1em=10em，width=10em=100px，height=10em=100px，
border=1em=10px，margin=1em=10px，padding=1em=10px； - div2Em：font-size=2em=20px，width=2em=40px，height=2em=40px，
border=1em=20px，margin=1em=20px，padding=1em=20px；效果如下图
em盒模型相对值
使用绝对定位的top，left，right，bottom值也是参考本身元素字体高度。
