Twitter bootstrap 在引导中动态关闭行div_Twitter Bootstrap

Twitter bootstrap 在引导中动态关闭行div

twitter-bootstrap

Twitter bootstrap 在引导中动态关闭行div,twitter-bootstrap,Twitter Bootstrap,我只是在尝试bootstrap，它看起来很棒，但我遇到了一个似乎太难解决的问题我有一个类似于砖石的格式，显示三列，然后无限次地转到新行 x x x x x x x x x （据我所知）在引导程序中必须这样编码： <div class="container-fluid"> <div class="row"> <div class="span4"></div> <div class="span4"></div>

我只是在尝试bootstrap，它看起来很棒，但我遇到了一个似乎太难解决的问题

我有一个类似于砖石的格式，显示三列，然后无限次地转到新行

x x x
x x x
x x x

（据我所知）在引导程序中必须这样编码：

<div class="container-fluid">
<div class="row">
    <div class="span4"></div>
    <div class="span4"></div>
    <div class="span4"></div>
</div>
<div class="row">
    <div class="span4"></div>
    <div class="span4"></div>
    <div class="span4"></div>
</div>
<div class="row">
    <div class="span4"></div>
    <div class="span4"></div>
    <div class="span4"></div>
</div>

但这是否意味着在我的代码视图（如rails）中，我需要执行某种循环，每3次监视一次，然后关闭行并启动一个新的行？我想这是bootstrap能够自行处理的事情

for($i=0;i<3;i++) {
   do something
}

for（$i=0；i这对你有用吗
为您的动态内容创建一个新容器，只需将所有内容转储到同一行中。然后使用CSS:n子选择器选择第4、第7、…个动态内容项，并调整CSS，使浮动正确工作
我包括了一些额外的内容来检查浮动和大小调整是否正常工作
CSS
HTML

X
X
X
X
X
X
X
X
X

=================================================================================
可以使用javascript或php添加动态HTML。例如，假设您使用的是php，内容来自数据库，引导页面是.php
引导页面的总体布局可以如下所示：
<?php connect to database and read in data ?>

<head> ...</head>
<body>
.......
......

<div class="container-fluid dynamic">
<div class="row">

<?php loop through data ?>
<div class="span4"> <?php echo $item data ?> </div>
<?php end loop ?>

</div><!-- end row -->
</div><!-- end container -->


...
.......
......

希望这有帮助我不明白，这完全是静态的。我想知道如何动态关闭行。嗨，澄清一下，您的问题是如何在页面中容纳未知数量的span4 div，还是如何将动态生成的html代码放入bootstap布局？我假设它们是相同的。如果如果要在一个页面上容纳未知数量的span4 div，难道不需要动态生成结束行标记吗？
<div class="container-fluid">
<div class="row">
<div class="span4">X</div>
<div class="span4">X</div>
<div class="span4">X</div>
</div>
<div class="row">
<div class="span4">X</div>
<div class="span4">X</div>
<div class="span4">X</div>
</div>
<div class="row">
<div class="span4">X</div>
<div class="span4">X</div>
<div class="span4">X</div>
</div>
</div>

</div><!-- end container -->

<div class="container-fluid dynamic">
<div class="row">

<div class="span4"></div>
<div class="span4"></div>
<div class="span4"></div>
<!-- repeat as req'd -->
</div><!-- end row -->
</div><!-- end container -->  

<?php connect to database and read in data ?>

<head> ...</head>
<body>
.......
......

<div class="container-fluid dynamic">
<div class="row">

<?php loop through data ?>
<div class="span4"> <?php echo $item data ?> </div>
<?php end loop ?>

</div><!-- end row -->
</div><!-- end container -->