如何将网格放在容器元素中?

时间:2015-09-17 06:44:49

标签: html css twitter-bootstrap

我目前正在Udacity做前端开发人员纳米学位,最近提交了一个使用bootstrap练习的项目。但是,我不太明白我在下面得到的反馈:

enter image description here

这是否要求我必须整理整个网页?

3 个答案:

答案 0 :(得分:1)

以下是使用bootstrap grid

时的规则
  • 行必须放在.container(固定宽度)或.container-fluid(全宽)范围内,以便正确对齐和填充。
  • 使用行创建水平的列组。
  • 内容应放在列中,只有列可能是行的直接子项。
  • 预定义的网格类(如.row.col-xs-4)可用于快速制作网格布局。 less mixins也可用于更多语义布局。
  • 列通过填充创建装订线(列内容之间的间隙)。该填充在第一列和最后一列的行中通过.rows。
  • 上的负余量进行偏移
  • 负边距是以下示例缩进的原因。这样,网格列中的内容与非网格内容排列在一起。
  • 通过指定要跨越的十二个可用列的数量来创建网格列。例如,三个相等的列将使用三个.col-xs-4
  • 如果一行中放置的列数超过12列,则每组额外列将作为一个单元换行换行。
  • 网格类适用于屏幕宽度大于或等于断点大小的设备,并覆盖针对较小设备的网格类。因此,例如将任何.col-md- *类应用于元素不仅会影响其在中型设备上的样式,而且如果不存在.col-lg-*类,也会影响大型设备。

答案 1 :(得分:0)

是的,只需在打开正文标记后立即放置<div class="container">并在正文结束前将其关闭</div>

答案 2 :(得分:0)

您可以在正文中插入.container.container-fluid div,如下所示

<body>
     <div class="container">
         <div class="row">
              grid columns
         </div>
     </div>
</body>