使用twitter bootstrap跨度在foreach

Question

你如何在foreach循環中使用twitter spans？

這是我的代碼：

<div class="row-fluid"> 
    <?foreach ($photos as $photo) { ?> 
     <div class="span4"> 
      stuff 
     </div> 
    <? }?> 
</div> 

但問題是第四輸出（也就是現在的第2行）是偏心的 - 由於保證金/填充到左側。

我試圖避免不得不添加一個計數器，並在每個第三循環後手動插入一個新的'行' - 通過bootstrap/css確實有一個更清潔的方式？

Answer 1

通過使用CSS3的第n個子選擇器，可以使用數學對象元素。

.span4:nth-child(3n+1) { 
    /* CSS here */ 
} 

3n個+ 1是其中n是由1遞增一個數學函數，所以這將目標元素＃1（3x0 + 1），＃4（3×1 + 1），＃7（3×2 + 1）等。