<p class="sycode"> </p> <p class="sycode"> </p> <p class="sycode"> 例如:.html文件代码如下, <br> <br></p> <br><title>居中DIV</title> <br> <br> <br> <div id="mainDiv> <br />居中的div <br /></div> <br /></body> <br /></html> </p>则实现居中的方法CSS代码为 <br /> 第一种方法: <br />body <br />{ <br />text-align:center ; <br />background-color:#ccc; <br />min-width:780px; <br />} <br />#mainDiv <br /> { <br /> width:760px; <br /> border:1px solid white; <br /> margin:0 auto <br />} <br /> 第二种: <br />负空白边定位法实现的CSS代码为 <br />body { <br />text-align:center <br /> background-color:#ccc; <br /> min-width:780px; <br /> } <br />#mainDiv <br /> { <br />width:760px; <br />margin-left:-380px; <br /> left:%50; <br /> positive:relative; <br />border:1px solid white <br />} <br />好了,有人会问为什么要使用“min-width”属性来定义body的最小宽度呢?,而且其最小宽度要大于或等于div的宽度。 <br />如果不怎样,可能会出现页面的内容被挤出浏览器的可视区域,具体这是为什么这个是浏览器的问题,各种浏览器对CSS <br /> 的支持有少许不同。留着大家自己去研究吧! </p> </p>"></div>