只要设置元素的box-pack和box-align即可，这两个属性当前只有webkit和moz支持，要设置垂直居中的话只需要将这两个属性的值都设置为center即可，需要的朋友可以参考下 以前处理垂直居中用的方法是设置div的height和line-height是一样的值，现在就不用那么麻烦了。只要设置元素的box-pack和box-align即可，这两个属性当前只有webkit和moz支持。其中box-pack控制的是水平的左和右，取值有：start(居左)，center(居中)，end(居右)。box-align的取值有：start(居上)，center(居中)，end(居下)。如果我们要设置垂直居中的话只需要将这两个属性的值都设置为center即可。当然了，这个前提是使用css3的盒布局，即将外层元素的display设置为box 复制代码代码如下: <style type="text/css"> #container{ display: box; display: -webkit-box; display: -moz-box; width:800px; height: 200px; border: 1px solid #ccc; -webkit-box-pack:center; -moz-box-pack:center; -webkit-box-align:center; -moz-box-align:center; } #div1{ background: orange; } #div2{ background: yellow; } #div3{ background: green; } </style> </head> <body> <div id="container"> <div id="div1">列1</div> <div id="div2">列2</div> <div id="div3">列3</div> </div> </body>