想必我们做全屏弹出蒙层的时候，通常是这么做的

1
2
3
4
5
6
7
8
.overlayer{
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
}

那么，上下左右居中怎么做呢？相信大家可以列出好多种，下面提供一种非常简便的方法：

1
2
3
4
5
6
7
8
9
10
11
.demo{
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 200px;
    height:200px;
    background-color: #000;
}

它跟全屏定位有某种相似的地方。这种上下左右居中的方法，就好比，张三要向左，李四要向右，王五要向上，马六要向下，互不相让，那就大家妥协一下，都到中间来，谁也不吃亏。逛知乎的的时候偶然发现的^_^