您的位置:首页 > 其它

font-size: 62.5% 的含义

2018-05-14 13:31 447 查看
各浏览器默认字体字号为 16px,即 16px 相当于 1rem

html, body {
font-size: 16px; /*default font-size equal 1 rem*/
}

h1 {
font-size: 1rem; /*16px * 1 = 16px*/
}

h2 {
font-size: .8rem; /*16px * 0.8 = 12.8px*/
}

当我们定义 10px / 16px = 0.625 = 62.5% 时,浏览器的默认字体为 16px * 62.5% = 10px

此时即 10px 相当于 1rem

html, body {
font-size: 62.5%; /* 10px / 16px = 62.5% 即 font-size 是 10px 相当于 1rem */
}

h1 {
font-size: 1rem; /*10px * 1 = 10px*/
}

h2 {
font-size: 1.2rem; /*10px * 1.2 = 12px*/
}

h2 {
font-size: 1.4rem; /*10px * 1.4 = 14px*/
}

至于为何不直接定义根元素的 font-size 为 10px 是为了兼容 IE6。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  font-size: 62.5% rem