CSS line-height属性，设置行高和垂直居中

line-height属性

这里将介绍两种有关CSS中line-height属性的用法，一是用于设置文本的行高，另一个则是用于设置元素相对于父元素的垂直居中样式。

line-height属性设置行高实例，及在线编辑器

首先，来看一下通过line-height属性设置本文行高的方法，注意，是行高，而不是段落跟段落之间的距离：

<p class='lh1'>这个段落p内的文本的行高line-height属性被设置为50px。本来可以通过br元素来分行，但为了能够更好地展现出line-height的属性样式，这里凑了很多的字数。</p>


<style>
  .lh1{line-height:50px;}
</style>

line-height属性值

属性值	描述
number数值	数字，无单位
em	相对长度单位
px	像素
cm	厘米
pt	标准长度单位1pt=1/72英寸

line-height属性设置垂直居中实例

<div class='lh2'>
  <p class='lh3'>内容</p>
</div>

<style>
  .lh2{width:100%;height:60px;border:1px solid skyblue;text-align:center;}
  .lh3{line-height:60px;}
</style>

hot：热门