如何使文本在DIV+CSS规划中垂直居中-XHTML教程-爱易网页

如何使文本在DIV+CSS规划中垂直居中

日期：2014-04-15　浏览次数：21171 次

　　DIV+CSS规划中垂直居中的实现。

<html>
<head>
<style>
body{TEXT-ALIGN: center;}
#center{ MARGIN-RIGHT: auto;
MARGIN-LEFT: auto;
height:200px;
background:#F00;
width:400px;
vertical-align:middle;
line-height:200px;
}
</style>
</head>
<body>
<div id="center"><p>test content</p></div>
</body>
</html>

　　演示效果：

<html><head><style>body{TEXT-ALIGN: center;}#center{ MARGIN-RIGHT: auto;MARGIN-LEFT: auto;height:200px;background:#F00;width:400px;vertical-align:middle;line-height:200px;}</style></head><body><div id="center"><p>爱易网任务室,这里是垂直居中文本</p></div></body></html>

[Ctrl+A 全部选择提示：你可先修正部分代码，再按运转]