如何使用 HTML/CSS 在网页的左右添加空间
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12429158/
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
How to add space to left-right of the Web-Page using HTML/CSS
提问by AppSensei
I want to add space in the HTML document like the ones inside the orange rectangle. I don't know the technical term for what it's professionally called. Apologies.
我想在 HTML 文档中添加空间，就像橙色矩形内的空间一样。我不知道它的专业名称的技术术语。道歉。
回答by Jrod
If you are looking to center your web page and you are using a fixed width on your main container this can easily be achieved.
如果您希望将网页居中，并且在主容器上使用固定宽度，则可以轻松实现。
CSS
CSS
.container {
margin:0 auto; /* this will center the page */
width:960px; /* use your width here */
}
HTML
HTML
<body>
<div class="container">
<!-- all your great content here -->
</div>
</body>
If you need help applying this to your html/css please post your html and I would be glad to help you.
如果您需要帮助将其应用于您的 html/css，请发布您的 html，我很乐意为您提供帮助。
回答by Ian
Why not do this? :
为什么不这样做？：
<style type="text/css">
html, body {
margin: 0;
border: 0;
width: 100%;
}
body {
padding: 0 20px;
}
#main {
margin: 0 auto; /* in case you want to set a fixed width on this as well */
}
</style>
<body>
<div id="main"></div>
</body>
This way, depending on the width on the window, the main div will resize and there will always be a fixed space on both sides. If you want the main div have a fixed width and the spacing on the sides to be resized automatically, use the other solutions.
这样，根据窗口上的宽度，主 div 将调整大小，并且两侧总是有固定的空间。如果您希望主 div 具有固定宽度并且自动调整两侧的间距，请使用其他解决方案。
回答by Matt Whipple
Those would be margins. But your better option would be to wrap the main area in a div or other block element/sectioning root, set it to the width that you want, and then center it with margin: 0 auto;
这些将是利润。但是您更好的选择是将主要区域包装在 div 或其他块元素/分段根中，将其设置为您想要的宽度，然后将其居中margin: 0 auto;
回答by kingkode
you need margins. set the style to margin:0 auto;that will center your div
你需要保证金。将样式设置为margin:0 auto;将使您的 div 居中
