经常我们需要对我们网页的元素进行垂直或是居中定位,在非ie,或是移动端的页面中可以使用如下代码来实现:
<html> <head> <style type="text/css"> #container{ display: box; display: -webkit-box; display: -moz-box; width:100%; height: 100%; 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><img src="img.png" width="200px" height="200px"></img></div> </div> </body> </html>