§ ITPOW >> 文档 >> CSS

CSS 实际应用-让人想不到的 line-height 的 em 算法

作者:vkvi 来源:ITPOW(原创) 日期:2017-2-23

em 和 % 意思一样,line-height:3em; 可以解释为 3 倍行高。

问题是:谁的 3 倍?

最终结果是 3 个 div 都是 60px 的行高,也就是说 line-height:3em; 是算出具体行高后,再拿给 div 继承,并不是 div 的 font-size * 3。

再看,取消默认字体大小时:

div 的行高全部是 48px,它用的是浏览器默认字体大小 16px * 3。

总结

所以继承 line-height,是继承的其具体尺寸,并不是继承的设置值。

相关文章