怎样使一个DIV在浏览器水平垂直居中?

小伙伴们平时做页面的时有没有遇到过让一个盒子漂浮到页面的正中间? 大家会第一时间想到的就是定位吧?使用定位还要给他量边距,会不会太麻烦了一点,快来看看我是怎么解决的吧。

1、首先先给两个盒子,wrapper为父级

<div class="wrapper">

<div class="ziji">
    <p>我是子集盒子</p>
</div>

</div>

2、来看看样式怎么写

.wrapper{
.whb(1000px,1000px,red);
.ziji{
    .whb(100px,100px,green);
    position: absolute;
    top: 50%;
    left: 50px;
    margin-top: -50px;
    margin-left: -50px;
}

}

很难理解? 给张图自行体会


分组.jpg
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容