bootstrap form-group vs row CSS哪个更喜欢

Question

我已经使用了行，现在使用表单组CSS。我对这些2感到困惑，如果我想构建表单控件，我应该更喜欢哪一个。似乎都做同样的工作。

Answer 1

我通常遵循这种模式：

<div class="form-group">
   <div class="row">
        <div class="col-md-6"></div>
        <div class="col-md-6"></div>
   </div>
</div>

请注意col-md-6和col-md-5是示例，您可以使用任意数量不限的col-md-x类。总和必须是12。

Answer 2

这可能是旧的，但也可能对某人有所帮助。无论如何，使用Bootstrap。

表单上每组控件的表单组。如果您的行有多个cols，并且每个col都有一个标签和一个输入文本，请在每个标签和输入控件周围放置一个表单组，例如：

{

<div class="row">
    <div class="col-6">
        <div class="form-group">
            <label>Client Name: </label>
            <input type="text" name="clientName" />
        </div>
    </div>

    <div class="col-6">
        <div class="form-group">
            <label>Client Email: </label>
            <input type="text" name="clientEmail />
        </div>
    </div>
</div>

...等}

Answer 3

您的问题的直接答案在文档中：

“.form-row”是我们的标准网格类“.row”的变体，它覆盖了默认的列排水沟，以实现更紧凑和更紧凑的布局

见这里：https://getbootstrap.com/docs/4.0/components/forms/#form-grid