我正在学习CSS，而且对我来说似乎并不合适。对于font-size，使用PX或EM似乎没有明显的区别。我使用EM和另一个PX创建了一个带有两个P的HTML。当我调整浏览器窗口的大小时，两个段落都以完全相同的方式调整大小。放大时，所有内容都会正确调整大小。所以请向我解释一下：D
我甚至在EM和PX中创建了一个不同字体大小的JS小提琴。在这里，尝试一下。 http://jsfiddle.net/5m0nyfq8/embedded/result/
<div id="root">
<span>ROOT EM font-size: 1.25em;</span>ac
<p class="em">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
<span>ROOT PX font-size: 24px;</span>
<p class="px">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
<div id="first">
<span>FIRST EM font-size: 0.9em;</span>
<p class="em">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
<span>FIRST PX font-size: 18px;</span>
<p class="px">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
<div id="secondwithinfirst">
<span>SECONDWITHINFIRST EM font-size: 0.88888888em; </span>
<p class="em">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
<span>SECONDWITHINFIRST PX font-size: 16px; </span>
<p class="px">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
</div> <!-- End Second Div -->
</div> <!-- End First Div -->
</div> <!-- End Root Div -->
<span>OUTSIDEROOT1 EM font-size: 1.5em;</span>
<p class="outsideroot1em">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
<span>OUTSIDEROOT1 PX font-size: 24px;</span>
<p class="outsideroot1px">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
<span>OUTSIDEROOT2 EM font-size: 1.875em;</span>
<p class="outsideroot2em">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
<span>OUTSIDEROOT2 PX font-size: 30px</span>
<p class="outsideroot2px">In hac habitasse platea dictumst. Mauris eu tortor porttitor, gravida metus non, venenatis eros. Maecenas scelerisque pulvinar lacus vitae scelerisque. Etiam porta sapien id ante consequat ullamcorper. Maecenas iaculis cursus ornare. Pellentesque vitae nibh nec velit tincidunt porttitor quis vitae erat. Duis eu risus lorem. Praesent convallis dui feugiat eros porta, vitae porta nisl lobortis. Duis eu nunc ultricies, pharetra velit eget, gravida nulla.</p>
body { background-color: #222; color: white; font-size: 1em;}
span { display: block; background-color: #840000; color: white; padding: 10px;}
#root { font-size: 1.25em; /* 20px */}
#root .px {font-size: 20px;}
#first {font-size: 0.9em; /* 18px */}
#first .px {font-size: 18px;}
#secondwithinfirst { font-size: 0.88888888em; /* 16px */ }
#secondwithinfirst .px { font-size: 16px;}
.outsideroot1em { font-size: 1.5em; /* 24px */}
.outsideroot1px { font-size: 24px;}
.outsideroot2em { font-size: 1.875em; /* 30px */}
.outsideroot2px { font-size: 30px;}
答案 0 :(得分：0)
1em等于当前的字体大小。 2em意味着当前字体大小的2倍。例如，如果元素显示为12 pt的字体，那么＆＃39; 2em＆＃39;是24磅＆＃39; em＆＃39;是CSS中非常有用的单元，因为它可以自动适应阅读器使用的字体http://www.w3schools.com/cssref/css_units.asp