我之前讨论过网页上“垂直居中”的事情。我也在网上搜索了一些文章。方法有很多，但只有三种方法与所有浏览器兼容。与大家分享：
方法一：
我们将div设置为绝对定位【position:absolute】，top设置为50%，然后定义高度height，将margin-top值设置为高度的一半，为负【margin-top:-height实例如下：/2：
Html：
- <div id=”box”>wwwwwwwwwweb前端之家.jiangweishan.com</div>
css：
- #box{position:absolute;height:200px;top:50%;margin-top:-100px}
注：与所有浏览器兼容，但当用户缩小浏览器窗口时，内容消失，滚动条消失。
方法二：
这种方法，在 content 插入一个元素外 div。设置此 div height:50%; margin-bottom:-contentheight；content 清除浮动并显示在中间。例如：
Html：
- <div id=”blank”></div>
- <div id=”box”>wwwwwwwwwweb前端之家.jiangweishan.com</div>
css：
- #blank{float:left;height:50%;margin-bottom:-100px}
- #box{position:relative;height:200px;clear:both}
注：与所有浏览器兼容，只是多了一个空标签。
方法三：
这种方法比较简单，可以设置行高，只适用于单行文本的垂直居中。例如:
Html：
- <div id=”box”>wwwwwwwwwweb前端之家.jiangweishan.com</div>
css：
- #box{height:100px;line-height:100px}
总结：
有很多方法可以实现垂直居中。目前，我只知道三种方法支持所有浏览器。如果英雄有其他方法，请留言指导。
