网站建设之层水平居中和垂直居中代码
时间：2010-01-13 00-00-00
网站建设经常遇到层的水平居中和垂直居中设置，特别是DIV+CSS网站布局中更是家常便饭。现提供如何使层垂直居中和水平居中以及绝对于浏览器居中的代码。
层垂直居中，设置层的line-height等于height高度即可实现，三盈网络【深圳网站建设】如下
#div {
height:30px;
line-height:30px;
}
层水平居中CSS代码：
#div {
margin:0 auto;
}
如需要使层垂直水平于浏览器居中，则可使用外补丁margin负值的方法，即负值为层自身宽度、高度除以2，如一个宽度400高度300的层需要绝对于浏览器居中，则使用绝对定位然后设置距离浏览器上与左都为50%，margin-top的值为－150，而margin-left的值为－200。
以下为层在浏览器绝对居中的CSS代码：
#div {
position:absolute;
top:50%;
left:50%;
margin:-150px 0 0 -200px;
width:400px;
height:300px;
}
调用：
<div id='div'>垂直居中或水平居中的层</div>
