margin:auto实现绝对定位元素的水平垂直居中

垂直水平居中

.element {
    width: 600px; height: 400px;
    position: absolute; left: 0; top: 0; right: 0; bottom: 0;
    margin: auto;    /* 有了这个就自动居中了 */
}

垂直居中

1. 利用行高（line-height）定位
2. 利用绝对定位
   元素的宽度/2 = 负左边距
   元素的高度/2 = 负上边距

.vert {
        width: 580px;
        height: 190px;
        position: absolute;
        top: 50%;
        left: 50%;
        margin: -95px 0 0 -290px;
}