html 文字在div中垂直居中显示,如何使文本在DIV中垂直居中

果是文字，便不能用背景方法，可以用增高行距的办法变通实现垂直居中，完整代码如下：

body{ TEXT-ALIGN: center; }

#center{ MARGIN-RIGHT: auto;

MARGIN-LEFT: auto;

height:200px;

background:#F00;

width:400px;

vertical-align:middle;

line-height:200px;

}

id="center">

test

content

说明：

vertical-align:middle;表示行内垂直居中，我们将行距增加到和整个DIV一样高line-height:200px;然后插入文字，就垂直居中了。

CSS+DIV控制页面中元素垂直居中代码 全局和区域垂直居中

body

{

text-align: center;

}

#a

{

width: 200px;

height: 400px;

background: #000;

}

#b

{

margin-top: expression_r((a.clientHeight-50)/2);

width: 50px;

height: 50px;

background: #FFF;

}

#c

{

position: absolute;

left: expression_r((body.clientWidth-50)/2);

top: expression_r((body.clientHeight-50)/2);

width: 50px;

height: 50px;

background: #F00;

}

id="b">

id="c">

另一方法:

style="background:blue;position:absolute;left:expression_r((body.clientWidth-50)/2);top:expression_r((body.clientHeight-50)/2);width:50;height:50">

***************************************

二，用JS使层居中

把如下代码加入

区域中

borderColorDark=#ffffff borderColorLight=#000000 cellPadding=0

cellSpacing=0 width="100%">

width=178>□::BEST4U论坛::

οnclick="L1.style.visibility='hidden'"

style="CURSOR: hand"

width=21>х

height=91>欢迎光临本站!
本站域名:
http://webform.cn

function moveit() //这个函数用于把层放到浏览器中间

{

L1.style.left=((document.body.offsetWidth-parseFloat

(L1.style.width))/2)+document.body.scrollLeft;

L1.style.top=((document.body.offsetHeight-parseFloat

(L1.style.height))/2)+document.body.scrollTop;

}

window.οnlοad=moveit; //网面打开时时执行moveit()

window.οnresize=moveit; //当调整浏览器大小时执行moveit()

window.οnscrοll=moveit; //当拉动滚动条时执行moveit()