css居中

1.div内文字垂直居中

text-align: center;
line-height: height px;

2.div在另一个div中垂直水平居中

html

<div class="box-big">
            <div class="box-small">我是一个垂直居中div。</div>
        </div>

css

.box-big{
                width:400px;
                height: 300px;
                background-color: pink;
                position: relative;/*父元素相对定位*/
            }
            .box-small{
                width:200px;
                height: 100px;
                text-align: center;
                line-height: 100px;
                position: absolute;/*子元素绝对定位*/
                top:50%;
                left: 50%;
                margin-top: -50px;
                margin-left: -100px;
                background-color:saddlebrown;
            }