Html 带有 twitter bootstrap 网格的单行全宽列
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26192952/
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
Single full-width column in row with twitter bootstrap grid
提问by knittl
When using bootstrap's grid, what is the best way to markup a single full-width column in a row?
使用引导程序的网格时，在一行中标记单个全宽列的最佳方法是什么？
Do you have to use container and row to hold the column (.container > .row > .col-xs-12 > .actual-content), or can you get rid of the row and column altogether and simply use a wrapping container (.container > .actual-content)?
您是否必须使用容器和行来保存列 ( .container > .row > .col-xs-12 > .actual-content)，或者您是否可以完全摆脱行和列而仅使用包装容器 ( .container > .actual-content)？
Let's say
让我们说
<div class="container">
<div class="row">
<!-- multiple columns -->
</div>
<div class="row">
<div class="col-xs-12">
<p>Actual content goes here. It will span the entire width.</p>
</div>
</div>
<div class="row">
<!-- multiple columns -->
</div>
</div>
vs
对比
<div class="container">
<div class="row">
<!-- multiple columns -->
</div>
<p>Actual content goes here. It will span the full width.</p>
<div class="row">
<!-- multiple columns -->
</div>
</div>
Is one approach considered superior over the other? Since the column spans the entire width for all media sizes, I don't need any responsive features. Rendered output should be the same, but maybe there are subtle differences which I'm not aware of. Using container, row, and column seems like overkill …
一种方法是否被认为优于另一种方法？由于该列跨越所有媒体尺寸的整个宽度，因此我不需要任何响应功能。渲染输出应该是相同的，但也许存在我不知道的细微差别。使用容器、行和列似乎有点矫枉过正……
采纳答案by Christina
The one withoutthe row/grid according to Bootstrap's own documentation. It is the correct way -- don't wrap it with more classes, that's more markup for NO reason.
在一个没有根据引导自己的文档行/格。这是正确的方法——不要用更多的类来包装它，这是无缘无故的更多标记。
I posted about this a couple days ago: col-*-12 (col-xs / col-sm / etc) use in Bootstrap 3
几天前我发布了这个：col-*-12 (col-xs / col-sm / etc) use in Bootstrap 3
Documentation:
文档：
No grid classes are necessary for full-width elements.
全角元素不需要网格类。
This is the correct way:
这是正确的方法：
<div class="container">
<div class="row">
<!-- multiple columns -->
</div><!-- closing .row -->
<p>Actual content goes here. It will span the full width.</p>
<div class="row">
<!-- multiple columns -->
</div><!-- closing .row -->
</div><!-- closing .container -->
