div自动适应浏览器窗口水平和垂直居中

html

<body>  
    <div id="centerDiv">自动适应水平和垂直居中</div>  
</body>

css

*{margin:0;padding:0;}  
    #centerDiv{width:834px; height:550px; border:1px solid #9f9f9f;
             position:absolute;
             left:50%;margin-left:-417px;
             top:50%;margin-top:-275px;
         }

原理就是:先用left:50%;top:50%让这个div的左上角居于页面的正中,然后用margin-left:-417px;margin-top:-275px;使div向左向上移动它自身宽高的一半.

2021-11-10
2021-12-01
2021-11-06
2022-12-23
2021-07-29
2022-12-23
2021-06-28
2021-10-29