Question

刚开始学习Bootstrap，例如设计了这样的表格，我想知道这些列号是否相互有意义？

<form class="form-horizontal">

  <div class="row">
    <div class="col-sm-6">
      <div class="form-group">
        <div class="col-sm-offset-2 col-sm-10">
          <div class="checkbox">
            <label>
              <input type="checkbox"> Website Active
            </label>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="row">
    <div class="col-sm-6">
      <div class="form-group">
        <div class="col-sm-offset-2 col-sm-10">
          <label>Display this message when the website is not active</label>
          <textarea class="form-control" rows="3" id="comment"></textarea>
        </div>
      </div>
    </div>
  </div>

</form>

Answer 1

See here我在评论中解释的不同之处：

在您的情况下，更合适的结构可能是：

            <div class="container">
                <div class="row">
                    <form class="form-horizontal">
                      <div class="col-sm-6">
                        <div class="form-group">
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox"> Website Active
                                    </label>
                                </div>
                        </div>
                      </div>
                      <div class="col-sm-6">
                        <div class="form-group">
                                <label>Display this message when the website is not active</label>
                                <textarea class="form-control" rows="3" id="comment"></textarea>
                        </div>
                      </div>
                    </form>
                </div>
             </div>

您必须在.container附近添加.container-fluid或.row课程

您可以在一个.row课程中尽可能多地.container。

See your code on a bootply fiddle

我的列号和引导宽度的结构是否有意义？

1 个答案: