怎么让网页(body)内容显示在正中间(左右的中、上下的中）？

a6711145 2009-12-07 05:31:27

如题：就是让网页内的内容不靠上、不靠下、不靠左、不靠右，显示在最中间？

...全文

2696 17 打赏收藏转发到动态举报

写回复

用AI写文章

17 条回复

切换为时间正序

请发表友善的回复…

发表回复

cnyygy 2011-05-05

打赏
举报

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>
body,html{margin:auto;height:100%;}
#outer{width:100%; height:100%;position:relative;}
#outer[id]{display:table;}
#middle{position:absolute;top:50%;}
#middle[id]{display:table-cell; position:static;vertical-align:middle}
#inner{position:relative;top:-50%;}
#content{width:400px; height:200px; margin:0 auto;padding:20px; background:#000;border:1px solid #666;font-family:"黑体";font-size:40px;color:#fff;}
</style>
</head>
<body>
<div id="outer">
<div id="middle">
<div id="inner">
<div id="content">
怎样让HTML文档在网页中上下左右完全居中？使用这个方法，就可达到你想要的效果。
</div>
</div>
</div>
</div>
</body>
</html>

lost11211333 2009-12-08

打赏
举报

使用2个div来完成楼主是否是想在不同分辨率下页面内容都居中？

a6711145 2009-12-08

打赏
举报

ding

yangming272727 2009-12-08

打赏
举报

svrmgrl connectinternal startup exit

a6711145 2009-12-08

打赏
举报

来人丫

a6711145 2009-12-08

打赏
举报

别晕丫，指点下额。

狼王_ 2009-12-08

打赏
举报

a6711145 2009-12-08

打赏
举报

我要的效果：

我任意调整窗口大小，内容始终在最中间就是要 center and middle .

a6711145 2009-12-08

打赏
举报

[Quote=引用 5 楼 fengqiao1999 的回复:]
<body id="css">
#css{
width:760px;
height:auto;
margin:auto;
padding-top:10%;
}
[/Quote]

还是达不到上下 middle 的效果哦，内容不在最中间

diandian82 2009-12-08

打赏
举报

肯定需要自己写js了。你上网搜一下吧

fengqiao1999 2009-12-08

打赏
举报

<body id="css">
#css{
width:760px;
height:auto;
margin:auto;
padding-top:10%;
}

a6711145 2009-12-08

打赏
举报

[Quote=引用 3 楼 sito_hongta 的回复:]
用CSS控制，建議不要調整body，而是用div，再設div的id＝“#main_container”就可以了

#main_container{
width:760px;
height:auto;
margin:auto;
padding-top:10%;
}
[/Quote]

......我要的就是要body 内容都在中间啊，就是我随便改变窗口大小，内容始终在中间就是要
center和middle 哦