Bootstrap网格系统：这段代码是否正确？

Question

我想问一下从Bootstrap的角度看这段代码是否正确？我希望答案是肯定的。问题是关于行和列之间的附加标记。

<div class="row">
<something>
<div class="col-sm-6">
a
</div>
<div class="col-sm-6">
b
</div>
</something>
</div>

P.S。 <something>没有css样式，这是AngularJS的指令。

Answer 1

这里没有错，但是使用bootstrap有更好的做法。

只需处理负边距和clearfix，检查样式​​是否正常。

顺便说一句，您可以使用＆＃34;评论指令＆＃34;如果你需要为angularJs指令使用那个东西标签。

Answer 2

在该代码中，something标记只会被赋予row div的整个12列宽。只要东西标签上没有任何东西会干扰，内部元素就会被分割成相关的网格。

我认为这应该可以正常工作，但作为旁注，我通常将其写为

<something>
<div class="row">
<div class="col-sm-6">
a
</div>
<div class="col-sm-6">
b
</div>
</div>
</something>

这样，您可以选择在需要时轻松地将更多行等添加到something部分，并且在我的拙见中仅提供可读性。

Answer 3

在这种情况下，row基本上与col-md-12具有相同的目的，但row将为左右两侧提供-15像素的余量。要避免使用水平滚动条，您可以使用类container将整个事物包装在div中。

Answer 4

来自Bootstrap docs ..

  

内容应放在列中，并且只能列   行的直接孩子。

Bootstrap row具有负余量以补偿列填充。 <something>并未在您的示例中特别导致问题，但从Bootstrap的角度来看它是不正确的。

Answer 5

对我来说很好看，但我认为根据你的“某事”元素，它可以改变