如何让一个DIV 居中在网页的中心

来源:互联网 发布:淘宝宝贝图片下载器 编辑:程序博客网 时间:2024/05/21 17:15
首先需要position:absolute;绝对定位。
而层的定位点,使用外补丁margin负值的方法。负值的大小为层自身宽度高度除以二。

如:一个层宽度是400,高度是300。      使用绝对定位距离上部与左部都设置成50%。      而margin-top的值为-150。     margin-left的值为-200。这样我们就实现了层垂直居中于浏览器的样式编写。


div {position:absolute;top:50%;left:50%;margin:-150px 0 0 -200px;width:400px;height:300px;border:1px solid #008800;}
       <div style="position: absolute; top: 50%; left: 50%; margin: -300px 0 0 -400px; width: 800px;               height: 600px; border: 1px solid #008800;">       </div>
原创粉丝点击