Html CSS - 将所有内容放在 body 标签中
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3103488/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS - center everything within the body tag
提问by Ben
I am trying to center everything within the tag on the page without adding another container within it. My situation doesn't allow me to change the markup that is being generated but I am able to edit the CSS. My overall objective is to create css that allows me to use the zoom tag in IE for the print css (to zoom out), but the way it is currently working, this creates a lot of white space on the right side and I'd like to make sure the content is always centered in the middle.
我试图将页面上标记内的所有内容居中,而不在其中添加另一个容器。我的情况不允许我更改正在生成的标记,但我能够编辑 CSS。我的总体目标是创建允许我在 IE 中使用缩放标签打印 css(缩小)的 css,但它目前的工作方式,这会在右侧创建很多空白区域,我会喜欢确保内容始终居中。
回答by jimr
If you're ok with giving the body a fixed width, you can center it by giving it a width and a margin of auto
for the left and right margins:
如果你可以给主体一个固定的宽度,你可以通过给它一个宽度和auto
左边距和右边距的边距来将它居中:
E.g:
例如:
body { width: 960px; margin: 0 auto; }
回答by Dr. Frankenstein
If you want something like this - http://jsbin.com/emomi3/5/...
如果你想要这样的东西 - http://jsbin.com/emomi3/5/...
body {
position: relative;
width: 100%;
border: 1px solid red;
display: block;
}
body > * {
margin: auto;
width: 500px;
border: 1px solid blue;
display: block;
overflow: auto;
}
body > script {
display: none
}
(The borders are just in for illustration purposes)
(边框仅用于说明目的)
回答by Karim Oukara
if you use primefaces ... , I recommend to you to add !important
like this :
如果您使用 primefaces ... ,我建议您添加!important
如下:
body {
width: 1280px;
height: 1024px;
margin: 0 auto !important;
}