css当中px、em、rem以及百分比之间的区别

Font-size:2em;

Height:2em;

}

那么，子元素footer的高度就是5*2*2*10=200px;此时1em=5*10=50px;字体的大小就是5*10*2=100px;

在fonter的子元素div当中，要是没有设定文本字体的大小

那么就继承父元素的字体大小，如果设定div：

.warpper{

Height:2em;

}

那么，div的高度就是5*2*2*10=200px;此时1em=5*2*10=100px;字体的大小就是5*10*2=100px；继承了父级字体的大小；

三、rem特点

rem是CSS3新增的一个相对单位（root em，根em），这个单位引起了广泛关注。这个单位与em有什么区别呢？区别在于使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素。这个单位可谓集相对大小和绝对大小的优点于一身，通过它既可以做到只修改根元素就成比例地调整所有字体大小，又可以避免字体大小逐层复合的连锁反应。目前，除了IE8及更早版本外，所有浏览器均已支持rem。对于不支持它的浏览器，应对方法也很简单，就是多写一个绝对单位的声明。这些浏览器会忽略用rem设定的字体大小。下面就是

一个例子：

p {font-size:14px; font-size:.875rem;}

注意：

选择使用什么字体单位主要由你的项目来决定，如果你的用户群都使用最新版的浏览器，那推荐使用rem，如果要考虑兼容性，那就使用px,或者两者同时使用。

四、百分比的特