Question

html中如何使整个页面居中 div+css+js 如何使页面窗口化内容不换行

html中如何使整个页面居中 div+css+js 如何使页面窗口化内容不换行

Answer 1

<style>
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}/*reset*/

.w{width:990px;margin:0 auto;}
</style>

<div class="w">我是990宽 居中</div>

只需要给div定一个宽度 加上margin:0 auto 就可以居中了。

追问

页面缩小会换行如何解决 页面窗口化如上   最大化如下

追答

将上面的logo部分 ,和下面导航部分都用一个居中的div包着

<style>
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}/*reset*/

.header{background:#eee;width:100%;height:80px;}
.w{width:990px;margin:0 auto;}
.nav{width:100%;height:30px;line-height:30px;background:blue;}
.nav a{padding-right:30px;color:#fff;}
</style>
 
<div class="header">
<div class="w"><a href＝“#”>logo</a></div>
</div>

<div class="nav">
<div class="w"><a href="#">导航一</a><a href="#">导航2</a><a href="#">导航3</a></div>
</div>