edge浏览器的兼容问题-原创手记-慕课网

首页课程实战体系课手记专栏慕课教程

edge浏览器的兼容问题

肥_皂 2017-04-07 16:52:48 浏览 5440

肥_皂

关注TA

手记 2

粉丝 1

获赞 14

<!DOCTYPE HTML>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<style>
    body { font-size: 16px; }
    div { margin: 100px auto 0; width: 5rem; height: 100px; background: red; }
</style>
</head>
<body>

<div></div>

<script src="jquery.js"></script>
<script>
$(function() {
    document.documentElement.style.fontSize = '625%';
});
</script>
</body>
</html>

兼容问题成因：
html标签font-size用js加载；
body元素font-size样式用px为单位；
样式表用rem为单位；

兼容方法: body标签字体单位用rem;