html - Bootstrap 网格和布局输出

Question

假设我有一段 HTML:

 <figure>
     <img/>
 </figure>

我需要将它们包装在 Twitter Bootstrap 3 列中，例如 <div class="col-md-3">{content}</div> 。我需要在循环中每 4 次生成行(对适合该行的 12 列求和)以生成网格。

实现这一目标的最佳方式是什么？

Twig 是否可以轻松提供该解决方案？我只想传递我需要的每一列类，然后“函数”自动拆分列。

我正在使用 https://stackoverflow.com/a/16428403/1110456 作为解决方案，但似乎有更好的方法来做到这一点。我目前使用 CakePHP 以及一个框架和 PHP 语言。

Answer 1

你需要尝试这样的事情。它将:

• 统计您的 View 中有多少个对象
• 将对象计数器和列计数器设置为零
• 如果这是您的第一篇专栏，请开始 <div class="row">
• 显示内容
• 将列计数器加一

• 如果这是第 4 列，或者如果这是您的最后一项，请关闭该行 div并重置列计数器。

  $count = count($models);
  $i = 0;
  $column = 0;
  
  foreach ($models as $model) { 
      if ($column == 0) {
          echo "<div class='row'>";
      }
  
      echo "<div class='col-md-3'>" . "Content" . "</div>"; 
  
      $column = $column + 1;
  
      if((++$i === $count && $column !== 4) || ($column == 4)) {
          echo "</div>";
          $column = 0;            
      }
  }