首页 新闻 赞助 找找看

怎么让这段代码显示的网页居中,求大神帮帮忙!!!

0
悬赏园豆:5 [已关闭问题] 关闭于 2014-02-25 16:37

Html:

<div>
<div class="topImg">
<div class="topImg_No1"><img src="images/gc_logo.png" width="470" height="52" /></div>
<div class="topImg_No2"><img src="images/gc_Contact-phone.jpg" width="200" height="79"/></div>
</div>
<div class="Navigation">
<center>
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">园区简介</a></li>
<li><a href="#">园区规划</a></li>
<li><a href="#">新闻中心</a></li>
<li><a href="#">政策规划</a></li>
<li><a href="#">办事指南</a></li>
<li><a href="#">意见反馈</a></li>
<li><a href="#">园区论坛</a></li>
</ul>
</center>
</div>

<div style="width:1000px; height:500px; background-color:#666;"></div>

css:

body{
margin:0px;
padding:0px;
font-size:12px;

}
xianshi{
width:1000px;
margin:0px auto;
}
/*-----------顶部*/
.topImg{
margin:0px;
padding:0px;
height:80px;
width:1000px;

}
.topImg_No1{
margin:0px;
padding:0px;
height:52px;
line-height:52px;
width:470px;
margin-top:13px;
float:left;
}

.topImg_No2
{
margin-top:0px;
padding:0px;
margin-right:10px;
text-align:right;
}
.Navigation{
width:1000px;
background-color:#006bb9;
height:34px;
}
.Navigation ul{
margin:0px;
padding:0px;
height:30px;
width:1000px;
}
.Navigation li {

margin:0px;
padding:0px;
position:relative;
text-decoration:none;
list-style:none;
font-weight:bold;

float:left;
width:100px;
height:30px;
font-family:"微软雅黑";
text-align:center;
vertical-align:middle;
line-height:30px;
font-size:16px;
}
.Navigation a{
text-decoration:none;
color:#FFF;
}

.Navigation a:hover{
color:#aedbea;
}

Web前端渣渣的主页 Web前端渣渣 | 初学一级 | 园豆:171
提问于:2013-09-11 17:21
< >
分享
所有回答(6)
0

margin-left:auto;margin-right:auto;

sinhbv | 园豆:2579 (老鸟四级) | 2013-09-11 17:27

用了  不行 

支持(0) 反对(0) Web前端渣渣 | 园豆:171 (初学一级) | 2013-09-11 17:39

@.Net初出江湖: body上加上width:100%试试吧

支持(0) 反对(0) sinhbv | 园豆:2579 (老鸟四级) | 2013-09-11 17:44

@sinhbv: 还是不行

支持(0) 反对(0) Web前端渣渣 | 园豆:171 (初学一级) | 2013-09-11 17:46
1

问题在于最外层div占满了整个屏幕的宽度,so:

方案1:最外层的div加上一个宽度。width:1000px,再加一个{margin:0 auto}

方案2:不用管最外层的div,给三个子div(图片,导航,内容区)都加上样式{margin:0 auto}

kafka No.14 | 园豆:122 (初学一级) | 2013-09-11 20:47
0

整个页面加<div id="container"></div>  css:margin:0 auto;这样就可以啦,最好给个宽度哈

yoyo啦 | 园豆:191 (初学一级) | 2013-09-11 21:14
0

外层那个div css设置margin:0 auto; width:随便设个宽度px;就可以解决了

淫光蝎子 | 园豆:184 (初学一级) | 2013-09-12 09:42
0

在整个html 中 用个《div》<center>  内容.......    </center>《/div》

Web前端渣渣 | 园豆:171 (初学一级) | 2013-09-12 10:32
0

在DIV+CSS里,块居中,可以设置margin:0px auto 就可以居中了!试试吧!

程序媛 | 园豆:37 (初学一级) | 2013-09-12 10:44
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册