必须是Bootstrap容器元素包含行元素吗？ [英] Must Bootstrap container elements include row elements?

问题描述

从我阅读的文档，似乎 .container 是父包装器的 .row 和包含 .spanX （其中x总计为12）的div。但是，它们的导航示例中似乎没有 .row 。

From my reading of the documentation, it seems that .container is the "parent" wrapper for the .row and the divs that contain the .spanX (where the x totals 12). However, it doesn't seem like there is a .row in their navigation example.

文档站点， .container 被几个navbar相关的div包装。

Also, on their documentation site, the .container is wrapped by a couple of navbar related divs.

任何人都可以阐述一下框架应该如何工作？我是新手。

Can anyone elaborate a bit on how the framework should work? I'm new to it.

推荐答案

.row 在 .container 里面不是必需的，但是当你开始想要多行时，最好包含它。

The .row class is not required inside a .container, but it is a good idea to include it anyways when you start incase you want multiple rows later on.

所有 .row 真的是确保所有的div都出现在自己的行上 .rows 。

All that .row really does is make sure that all of the divs inside of it appear on their own line, separated from the previous and the following .rows.

对于 .container 里面的 .navbar divs，这是一个单独的事情，需要使导航栏与页面的其余部分对齐。如果你再看一下渲染的HTML，你会看到有另一个 .container 不在任何 .navbar

For the .container inside of the .navbar divs, that is a separate thing that is required to make the navbar line up with the rest of the page. If you look further down in the rendered HTML, you'll see that there is another .container that is not inside any .navbar divs, and that is the one with all of the main content.

<div class="container">
  <div class="row">
    <!-- These divs are inline and do NOT fill up the full 12 columns -->
    <div class="span4">...</div>
    <div class="span4">...</div>
  </div>

  <!-- This is a automatically a new line of divs -->
  <div class="row">
    <!-- This div will appear below the previous row, even though it
      would fit next to the other divs -->
    <div class="span4"></div>
  </div>

  <!-- These will appear in their own row, but may act
    unexpectedly in certain situations -->
  <div class="span4"></div>
  <div class="span4"></div>
</div>

简短

.row 定义一行div，如名称所暗示的。每个都指示一行新的div，无论上面的行是否已满。

In Short

.row defines a row of divs, like the name implies. Each one indicates a new line of divs, no matter if the above line is full or not.

这篇关于必须是Bootstrap容器元素包含行元素吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！