在引导程序的 col 类中使用 col 类可以吗？答案

【问题标题】：Is it ok to use col class inside col class in bootstrap?在引导程序的 col 类中使用 col 类可以吗？
【发布时间】：2016-09-02 11:29:08
【问题描述】：

我想在带有hr 元素的段落下方画一条线。问题是 p 元素在引导程序中有 15px 的填充，但 hr 元素跨越了整个可用宽度。段落下方的行向左延伸 15 像素，向右延伸 15 像素到段落的宽度。所以我只是做了以下事情：

             <div class="row">
              <div class="col-lg-12 text-justify">
                <p> 
                  Some text is here.
                </p>

              </div>
              <div class="row">
                <div class="col-lg-12"> <div class="col-lg-12"><hr></div></div>
              </div>

我将col-lg-12 直接嵌套在col-lg-12 中。但在引导程序中，我们应该将.col 嵌套在.row 类中。那么这里可以在 col 类中使用 col 类吗？

【问题讨论】：

“可以吗？”。浏览器不会抱怨，但这不是一个好习惯。只需添加一个自定义类并提供填充。
它是否实现了您想要的布局？没有任何规则。做你喜欢的事。
它可能不计算在内并根据包装器应用所有内容..我建议在这种情况下使用 flexbox
其实问题是错的。段落没有填充。我错误地将.row 直接嵌套在.row 中。更正后，我现在不再需要将.col 嵌套在.col 中。我应该删除问题吗？

标签： html css twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

否。这不是 Bootstrap 的最佳实践，因为正如您提到的 col 应该在行内。效果将是内部 col 左右两侧的额外间距。内部列将换行，而不是按预期水平布局。

"内容必须放在列中，并且只能放在列中行的直接子代”

【讨论】：