在 chrome、firefox 及 IE8 以上的浏览器下可以设置块级元素的 display 为 table-cell，激活 vertical-align 属性，但注意 IE6、7 并不支持这个样式。
html代码：
<div class="container"> <div> <p>看我是否可以居中。</p> <p>看我是否可以居中。</p> <p>看我是否可以居中。</p> <p>看我是否可以居中。</p> <p>看我是否可以居中。</p> </div> </div>
css代码：
1 <style> 2 .container{ 3 height:300px; 4 background:#ccc; 5 display:table-cell;/*IE8以上及Chrome、Firefox*/ 6 vertical-align:middle;/*IE8以上及Chrome、Firefox*/ 7 } 8 </style>
这种方法的好处是不用添加多余的无意义的标签，但缺点也很明显，它的兼容性不是很好，不兼容 IE6、7。
原文：http://www.cnblogs.com/crazy-IT-Boy/p/4720808.html