css中轻松实现内容的垂直居中

css中实现内容的垂直居中，我们都知道有一个 vertical-align属性，过去一直都会第一个想到它，但是在实际开发的过程中这个属性它似乎并不是那么“好用”。

在网上搜了一些方法，分享其中一个已经使用的，就是用line-height属性去定义行高，使行高与当前标签的外围标签同高就可以实现垂直居中的效果。

例如：

<div id="wrapper" style="height:50px">

<p style="line-height:50px">这里是要垂直居中的内容</p>

</div>