概述
一直有人搞不明白line-height:2和line-height:2em的区别，因为他们不知道或者还没遇到过这类的问题或者差异。
line-height:2是2倍的意思，如果内部有不同大小文字的情况下，以最大文字为倍数。
line-height:2em也是2倍文字大小的意思，但如果内部有大文字，它还是会以父容器的大小来计算。
请看如下代码：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>line-height:2和line-height:2em的区别，它们是有区别的</title>
<style type="text/css">
* { margin: 0; padding: 0; }
h2 { margin: 30px 0; }
body { font-size: 14px; }
.lh2 { line-height: 2; }
.lh2em { line-height: 2em; }
span { font-size: 60px; }
</style>
</head>
<body>
<div style="width:300px;">
<h2>line-height:2</h2>
<div class="lh2">我是行高我是行高我是行高我是行高我是行高我是行高我是行高我是行高<span>我是大文字</span>我是行高我是行高我是行高我是行高我是行高我是行高我是行高我是行高我是行高</div>
<h2>line-height:2em</h2>
<div class="lh2em">我是行高我是行高我是行高我是行高我是行高我是行高我是行高我是行高<span>我是大文字</span>我是行高我是行高我是行高我是行高我是行高我是行高我是行高我是行高我是行高</div>
</div>
</body>
</html>
转载于:https://www.cnblogs.com/zhp404/articles/3784396.html
最后
以上就是高高大象为你收集整理的line-height:2和line-height:2em的区别，它们是有区别的的全部内容，希望文章能够帮你解决line-height:2和line-height:2em的区别，它们是有区别的所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复