DIV教程之css教程:DIV垂直居中的举措
更好的控制页面布局。不用多说。经由明天一翻改善，终究找出懂得决DIV垂直居中的举措。
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>CSS结构技能：未知高度div垂直居中的成绩</title>
<styletype="text/css">
html,body
{
height:100%;
padding:0;
margin:0;
}
body
{
min-height:200px;
text-align:center;
min-width:402px
}
.FirstDIV
{
margin-top:-100px;/*SecondDIV高度的一半*/
float:left;
width:100%;
height:50%;
}
.SecondDIV
{
clear:both;
border:silver1pxsolid;
background:#666;
margin-left:auto;
overflow:auto;
width:400px;
margin-right:auto;
height:200px;
text-align:left
}
</style>
</head>
<body>
<divclass="FirstDIV"></div>
<divclass="SecondDIV">
<p>看看，这不就居中了。呵呵。并且没有成绩哦。www.Webjx.com</p>
<p>body{background-color:#FFF5F0}<br>
div{position:absolute;top:50%;left:50%;margin:-100px00-200px;
width:400px;height:200px;border:1px#CCCC00solid;font-family:Arial,
Helvetica,sans-serif;color:#666666}</p>
</div>
</body>
</html>
演示代码：
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title>CSS结构技能：未知高度div垂直居中的成绩</title><styletype="text/css">html,body{height:100%;padding:0;margin:0;}body{min-height:200px;text-align:center;min-width:402px}.FirstDIV{margin-top:-100px;/*SecondDIV高度的一半*/float:left;width:100%;height:50%;}.SecondDIV{clear:both;border:silver1pxsolid;background:#666;margin-left:auto;overflow:auto;width:400px;margin-right:auto;height:200px;text-align:left}</style></head><body><divclass="FirstDIV"></div><divclass="SecondDIV"><p>看看，这不就居中了。呵呵。并且没有成绩哦。www.Webjx.com</p><p>body{background-color:#FFF5F0}<br>div{position:absolute;top:50%;left:50%;margin:-100px00-200px;width:400px;height:200px;border:1px#CCCC00solid;font-family:Arial,Helvetica,sans-serif;color:#666666}</p></div></body></html>
层叠样式表（CascadingStyleSheets）的缩写，用于定义HTML元素的显示形式，是W3C推出的格式化网页内容的标准技术。网页设计者必须掌握的技术之一。 还可以在Dreamweaver常用工具中选择超级链接，完成相应的填写即可。 Adobe Dreamweaver CS5 软件使设计人员和开发人员能充满自信地构建基于标准的网站。由于同新的 Adobe CS Live 在线服务 Adobe BrowserLab 集成。 难以逾越的障碍会大大打击你的学习积极性。这就需要你的恒心，坚持不懈的决心。在自己无法解决某些问题时，就需要虚心请教别人. Adobe Dreamweaver CS5 软件使设计人员和开发人员能充满自信地构建基于标准的网站。由于同新的 Adobe CS Live 在线服务 Adobe BrowserLab 集成。 Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。 在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。 Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器，在编辑时能同时看到源码和设计界面，非常方便新手学习制作网页。
页:
[1]