ZURB基金会:我应该为每个"行"创建行吗？

Question

那么,我可以创建一个<div class="row">并推送列吗？列的总长度将更大12个单位.这是不好的风格,我应该为每一行创建行？

Answer 1

这取决于你想要的行为.如果连续超过12列,它们将按原样包裹到下一行

一行中超过12列将包装

<div class="row">
 <div class="small-2 large-4 columns">. . .</div>
 <div class="small-2 large-4 columns">. . .</div>
 <div class="small-2 large-4 columns">. . .</div>
 <div class="small-2 large-4 columns">. . .</div>
 <div class="small-2 large-4 columns">. . .</div>   
</div>

|  1 |  2 |  3  |  4  |  5  |  6  |  7  |  8  |  9  |  10 |  11 |  12 |

-----------------------------------------------------------------------
|                     |                       |                       |
|   div1              |      div2             |      div3             |    
|                     |                       |                       |
-----------------------------------------------------------------------
|                     |                       |
|   div4              |      div5             |
|                     |                       |
-----------------------------------------------

相当于2行

    <div class="row">
     <div class="small-2 large-4 columns">...</div>
     <div class="small-2 large-4 columns">...</div>
     <div class="small-2 large-4 columns">...</div>
   </div>
   <div class="row">
     <div class="small-2 large-4 columns">...</div>
     <div class="small-2 large-4 columns">...</div>
     <div class="small-2 large-4 columns">...</div>
   </div>

|  1 |  2 |  3  |  4  |  5  |  6  |  7  |  8  |  9  |  10 |  11 |  12 |

-----------------------------------------------------------------------
|                     |                       |                       |
|   div1              |      div2             |      div3             |  (row 1)
|                     |                       |                       |
-----------------------------------------------------------------------

-----------------------------------------------
|                     |                       |
|   div1              |      div2             |   (row 2)
|                     |                       |
-----------------------------------------------

这里有更多细节了解基础4中的Div类