CSS-css如何让整个页面居中?

CSS-css如何让整个页面居中?

虐人心 发布于 2017-10-06 字数 117 浏览 1310 回复 5

想要整个页面的元素居中
加上了这样的一个属性body{margin:0 auto;}可是页面依然无法居中,是不是需要指定宽度?

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

想挽留 2017-11-09 5 楼

在设定 body 的宽度之后,使用 margin:x auto; 值(X可以是任何值),页面可以居中。但一般不这样用,body 的缺省宽度是100%,如果进行设定固定宽度,在涉及到背景层平铺等 CSS 设定时将会影响效果。

但我不明白您的“相对于制定宽度居中”什么意思(求解释)。

您在评论中提到“如果在body下设定div层,整个页面就包在一个div里面了”,就是这样的,这里的div还可以是其它标签,比如p、table等,只是该答案回答者选择了在目前常用的div+css布局里的div标签来举例。

甜柠檬 2017-11-01 4 楼

前几天刚解决一个这个问题,如果已经css已经指定margin:0 auto.但是还是无法居中,有时候可能和网页的编码方式有关系,特别是UTF8的时候,需要特别注意BOM,可以尝试修改下utf8 无bom方式试试

想挽留 2017-10-29 3 楼

我们平时做网站的解决方法是将所有body里面的元素外加层div 叫做wrap
然后给wrap 加上宽度属性,和margin:0 auto.
像你这样给body加这个属性不起作用的原因就是宽度。

浮生未歇 2017-10-27 2 楼

这个 margin 设置在 body 上应该是不正确的,你可以在body下再建立一个容器 div, 设置这个 div { margin:0 auto;}

归属感 2017-10-08 1 楼

<!doctype html><meta http-equiv="content-type" content="text/html;charset=utf-8">
<head><title>居中兼容IE6.</title>
<style>
body { text-align: center; }
wrap { margin: 0 auto; width:960px; text-align: left; }
</style><head>
<body>
<div id="wrap">
...
</div>
</body>
</html>