9. 水平垂直居中的方法

方法一：未知宽高的块元素水平垂直居中？（仅限webkit内核，请看以下代码）

css：

*{ padding: 0; margin: 0; }
html, body{ height: 100%; }
.box{ height: 100%; font-size: 20px; color: #fff; display: -webkit-box; -webkit-box-pack: center; -webkit-box-align: center; }
.box div{ width: 100px; height: 100px; background: red; border: 1px solid #fff; }

 

html：

<div class="box">
    <div>1</div>
    <div>2</div>
    <div>3</div>
</div>