答案为：
line-height: 2 表示单行文本的行高为它本身的两倍
line-height: 200% 表示单行文本的行高为系统默认字体的200%
在继承性上：
对父元素设置了line-height: 2后，父元素的子元素会继承line-height: 2这个属性，子元素的行高都是自身高度的2倍，是相对大小，子元素的字体大小不同，行高也会不同；
对父元素设置了line-height: 200%后，父元素的子元素会继承系统默认字体的200%，是一个固定的值，是固定大小，子元素的字体大小不同，行高都是固定某个值；
实际写代码验证下，看看对不对
浏览器：chrome（Chrome的默认字体大小为16px）
代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>line-height: 2;</title>
<style>
.one {
line-height: 3; /*为了更好的区分，这里设置为3*/
}
.two {
line-height: 200%;
}
</style>
</head>
<body>
<div class="one">
line-height应该是他本身字体16px的3倍
</div>
<div class="two">
line-height应该是系统默认字体16px的200%
</div>
</body>
</html>
页面效果
line-heigh属性0001.png
CSS中line-height: 3;盒模型查看
line-heigh属性0002.png
去掉样式line-height: 3;看看
line-height0003.png
CSS中line-height: 200%;盒模型查看
line-height0004.png
去掉样式line-height: 200%;看看
line-height0005.png
继承性
对父元素设置line-height：2；
line-height0006.png
line-height0007.png
对父元素设置line-height：200%；
line-height0008.png
line-height0009.png
网友评论