.test div{300px;margin:15px 0;border:1px solid #000;}
.test p{margin:0;font-size:30px;}
.fixed div{line-height:20px;}
.percentage div{line-height:130%;}
.gene div{line-height:1.5;}
</style>
</head>
<body>
<ul class="test">
<li class="fixed">
<strong>固定数值方式：</strong> - {line-height:20px;}
<div><p>使用固定数值的方式定义line-height，如设置行高为18px类似这样的固定数值，可能会引发文字重叠的现象。</p></div>
</li>
<li class="percentage">
<strong>百分比方式：</strong> - {line-height:130%;}
<div>
如果是这种情况
<p>使用百分比的方式定义line-height，与使用固定数值方式一样，也可能会引发文字重叠的现象。</p>
</div>
</li>
<li class="gene">
<strong>因子方式：</strong> - {line-height:1.5;}
<div>
如果是这种情况
<p>使用因子方式定义line-height是非常安全的方式，将可以避免文字重叠的现象。</p>
</div>
</li>