首页 > 其他 > 详细

line-height:2和line-height:2em的区别,它们是有区别的

时间:2014-08-08 01:43:35      阅读:385      评论:0      收藏:0      [点我收藏+]

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>

 

所以这里要针对情况来处理,建议使用2,而不是2em。

line-height:2和line-height:2em的区别,它们是有区别的,布布扣,bubuko.com

line-height:2和line-height:2em的区别,它们是有区别的

原文:http://www.cnblogs.com/aobingyan/p/3898302.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!