【CSS3】div水平垂直居中

大部分的登陆页面都需要登录框保持在屏幕中间。

以前都是通过JS来获取实时的页面大小,改变元素的位置。

现在可以直接使用CSS3保持水平垂直居中

首先要让html,body元素铺满整个页面

        html,
        body {
            width: 100%;
            height: 100%;
            margin: 0px;
            padding: 0px;
        }

然后整个登陆框的div元素加入居中的代码

        .wrapperlayout {
            display: flex;
            justify-content:center;
            align-items: center;
            height: 100%;
        }

 

posted @ 2019-04-26 16:17  HanJunOvO  阅读(806)  评论(0编辑  收藏  举报