twitter-bootstrap 引导全宽列
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/27063641/
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
bootstrap full width column
提问by Stathis G.
I've had this question for a while, yet I cannot find a reasonable answer.
这个问题我已经有一段时间了，但我找不到合理的答案。
Bootstrap states the following: Content should be placed within columns, and only columns may be immediate children of rows.
Bootstrap 声明如下： 内容应该放在列中，并且只有列可以是行的直接子项。
But when I have a row and need to place a full width div underneath what should I do? Should I put a col-xs-12? For example
但是当我有一排并且需要在下面放置一个全宽 div 时我该怎么办？我应该放一个 col-xs-12 吗？例如
<div class="row">
<h1>Title</h1>
<div class="col-md-6">Some content here</div>
<div class="col-md-6">Other content here</div>
</div>
The h1 is full width.
h1 是全宽。
According to bootstrap it is not correct to do this, so how should I do it? Should I place the h1 inside a column or not?
根据引导程序，这样做是不正确的，那么我该怎么做呢？我应该将 h1 放在列中吗？
采纳答案by JohnnyHK
A row is a single horizontal group of columns, so the h1element belongs above the row:
一行是一组水平的列，因此该h1元素属于该行的上方：
<h1>Title</h1>
<div class="row">
<div class="col-md-6">Some content here</div>
<div class="col-md-6">Other content here</div>
</div>
Or in its own row that uses a single full-width column, but it's not necessary:
或者在它自己的行中使用单个全角列，但没有必要：
<div class="row">
<div class="col-md-12">
<h1>Title</h1>
</div>
</div>
<div class="row">
<div class="col-md-6">Some content here</div>
<div class="col-md-6">Other content here</div>
</div>
回答by Sun
<div class="row">
<h1>Title</h1>
</div>
<div class="row">
<div class="col-md-6">Some content here</div>
<div class="col-md-6">Other content here</div>
</div>
You should use cols, if you don't know what you are doing. The thing is, that cols have a padding-left 15pxand a padding-right 15px. And rows have margin-left -15pxand margin-right -15px. If you are using divs in rows without cols:
如果您不知道自己在做什么，则应该使用 cols。问题是， cols 有 apadding-left 15px和 a padding-right 15px。行有margin-left -15px和margin-right -15px。如果您在没有列的行中使用 div：
<div class="row">
<div>
content
</div>
</div>
then you get a problem with left and rightside indentation, if you mix it up with:
那么你会遇到左右缩进的问题，如果你把它和：
<div class="row">
<div class="col-...">
content
</div>
</div>
Therefore it's always better to do it with cols.
因此，使用 cols 总是更好。
