如何创建具有不同列宽度的动态网格

Question

我正在使用Bootstrap 3和Rails。

我有一个叫做Work的模型，有许多记录。

我想创建一个动态网格，其中列的宽度取决于其行。事情是这样的：

我再培训局的看法：

<ul class="row"> 
    <% @works.each do |s| %> 
     <li class="col-sm-4"><%= s.name %></li> 
    <% end %> 
</ul> 

这样，每个li元素将有一个COL-SM-4宽度每次。

我需要告诉Rails“每4个元素更改列宽为x ......”

任何帮助吗？谢谢！

Answer 1

事情是这样的：

<% @works.each_with_index do |s,index| %> 
     <li class="col-sm-<%= index%4 == 0 ? '4': '6' %>"><%= s.name %></li> 
    <% end %> 

Answer 2

我终于用你each_with_index定制的布局，因为它遵循：

  <% @services.each_with_index do |s, index| %> 
       <% if index < 2 %> 
        <li class="col-sm-6"><%= s.name %></li> 
       <% elsif index.between?(2,4) %> 
        <li class="col-sm-4"><%= s.name %></li> 
       <% elsif index > 4 %> 
        <li class="col-sm-6"><%= s.name %></li> 
       <% end %> 
      <% end %> 

谢谢！