如何用CSS限定网页宽度，又如何让一个DIV在网页当中居中呢？
如何用CSS限定网页宽度，又如何让一个DIV在网页当中居中呢？尝试了给BODY标签选择器里面添加width属性来限制网页宽度，没用。尝试了用DIV{margin：0aut...
如何用CSS限定网页宽度，又如何让一个DIV在网页当中居中呢？尝试了给BODY标签选择器里面添加width属性来限制网页宽度，没用。尝试了用DIV{margin：0 auto }来设置DIV居中，还是没用。后者我不知道是不是因为前者没生效，所以网页宽度无法计算，导致的DIV不能自动居中？该怎么设置呢？
展开
5个回答
展开全部
用CSS限定网页宽度，又让一个DIV在网页当中居中,这里需要理解的是一个页面的内容区域，就是body，我们就是通过给body来设置一个宽度，来做限制，至于DIV的居中，首先是需要给这个div一个宽度和高度，然后在使用margin去做，margin的用法，如图：
具体的实现看代码:
<html>
<head>
body{
width:960px; //限定网页的宽度
}
#div1{
width:200px;
height:600px;
margin:0 auto;
boreder:1px solid #f00 //加个边框利于观察
}
</head>
<body>
<div id='div1'>
我会居中
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
margin:0px auto;需要配合<!DOCTYPE 标签使用！也就是要声明代码支持的版本！一般说：
HTML 4.0 : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML5： <!DOCTYPE HTML>
有时候，你直接写<html></html>这样的标签，有些属性是不支持，特别是在IE系列的浏览器下~~
直接在标签中写属性的方法已经不推荐了！如：<body width="960px">这种写法不错，但是不推荐！
对于页面的宽度一般使用js等脚本控制！当然，css也有相关的属性（min-width,max-width,min-height,max-height），但是，有些浏览器不支持！
假设想要一个页面居中，方法有很多，标准的方法就是margin了~例如：
css中定义一个类属性
.main {width:960px;margin:0px auto;}
html中调用~
<div class="main">居中对齐</div>
<div class="main header">第二个居中对齐</div>
css中类的定义就这么个好处~一次定义，无限使用~
其他的居中方法有js计算（窗口宽度/2 -元素宽度/2就得到了元素距离窗口左侧的距离，这个需要配合window.resize窗口缩放事件并用），text-align(外层元素text-align：center；据中，内部元素继续text-align：left。一般这样的写法是给IE5的~呵呵~)，table搞笑法（新建table，三列，100%,中间的td就是绝对居中的）....还有很多，反正说来说去：固定宽度，margin不错~流体宽度js不错~其他的都是扯淡~呵呵
-------------------------------------------------PS------------------------------------
默认情况下，使用div定义一个内容区域，他就是居中对齐的~因为div本身是100%宽度的~
另外，你需要了解一下960 grid。学会框架，样式分离使用~~例如：我会定义一个layout.css文件来放置各种模块的宽度设置，定位设置等布局用的属性，而页面的其他样式，什么背景色，颜色，链接，我会放到一个style.css或者main.css（一般公用的样式放在其中），当然，如果还有其他很多页面样式，我则可以继续新建css去放置！
这样一来，页面调用就好说了：先载入框架，layout.css，然后载入全局样式，main.css，如果这个页面比较特殊，有他自己的样式，则，继续载入该页面的样式,home.css~~
当然layout.css是可以重复使用的~~除此之外，还有reset.css【重置html默认样式】等等....
HTML 4.0 : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML5： <!DOCTYPE HTML>
有时候，你直接写<html></html>这样的标签，有些属性是不支持，特别是在IE系列的浏览器下~~
直接在标签中写属性的方法已经不推荐了！如：<body width="960px">这种写法不错，但是不推荐！
对于页面的宽度一般使用js等脚本控制！当然，css也有相关的属性（min-width,max-width,min-height,max-height），但是，有些浏览器不支持！
假设想要一个页面居中，方法有很多，标准的方法就是margin了~例如：
css中定义一个类属性
.main {width:960px;margin:0px auto;}
html中调用~
<div class="main">居中对齐</div>
<div class="main header">第二个居中对齐</div>
css中类的定义就这么个好处~一次定义，无限使用~
其他的居中方法有js计算（窗口宽度/2 -元素宽度/2就得到了元素距离窗口左侧的距离，这个需要配合window.resize窗口缩放事件并用），text-align(外层元素text-align：center；据中，内部元素继续text-align：left。一般这样的写法是给IE5的~呵呵~)，table搞笑法（新建table，三列，100%,中间的td就是绝对居中的）....还有很多，反正说来说去：固定宽度，margin不错~流体宽度js不错~其他的都是扯淡~呵呵
-------------------------------------------------PS------------------------------------
默认情况下，使用div定义一个内容区域，他就是居中对齐的~因为div本身是100%宽度的~
另外，你需要了解一下960 grid。学会框架，样式分离使用~~例如：我会定义一个layout.css文件来放置各种模块的宽度设置，定位设置等布局用的属性，而页面的其他样式，什么背景色，颜色，链接，我会放到一个style.css或者main.css（一般公用的样式放在其中），当然，如果还有其他很多页面样式，我则可以继续新建css去放置！
这样一来，页面调用就好说了：先载入框架，layout.css，然后载入全局样式，main.css，如果这个页面比较特殊，有他自己的样式，则，继续载入该页面的样式,home.css~~
当然layout.css是可以重复使用的~~除此之外，还有reset.css【重置html默认样式】等等....
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
不要在body里面设置例如width、height等值，如果想让div居中，设置body的margin:px;padding:0px;就可以了，然后给div设置你说的margin:0 auto;就可以了；实在不行你可以设置body{margin:0px;padding:0px;position:relative;}然后设置你想剧中的div{position:absolute;top:50%;left:50%;margin:-h(div的高度/2)px 0 0 -w(div的宽度/2)px;}应该就可以了 希望可以帮到你
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
在你需要剧中的div外层套一层div，将外层div样式调整为：left：50%，绝对定位。然后将你需要剧中的div，绝对定位，left：-50%；
就好了。
上面的比较复杂，是div不定宽的时候用的，如果定宽的话，直接写上宽度，然后margin：0 auto 就行了
就好了。
上面的比较复杂，是div不定宽的时候用的，如果定宽的话，直接写上宽度，然后margin：0 auto 就行了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
上代码
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（3）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
