IE浏览器加载rem自适应网页元素尺寸显示异常
使用rem制作等比例缩放自适应网页,在IE浏览器下会出现页面加载完成后,使用了 rem
单位的网页元素尺寸显示异常的问题。原因是给body标签的 font-size
属性定义了固定大小的默认值,解决方法是把 font-size
属性值设置为 100%
,直接删除该属性。
示例:
原代码
body { font:normal 16px/1.875em 'Arial'; }
修改为
body { font:normal 100%/1.875em 'Arial'; }
如果想要给网页定义默认字体大小,又不想影响rem,在body之间添加个div,然后给这个div定义默认值
示例:
HTML代码
<html> <head> …… </head> <body> <div id="wrapper"> …… </div> </body> </html>
CSS代码
body { font-size:100%; } #wrapper { font-size:16px; line-height:1.875em; }