通过在rails中使用scss文件显示集合视图

Question

我想将问题模型信息显示为如图片1的集合视图。但是，我不知道该怎么做。 我现在的看法就像picture2。我想将每个问题主体显示为集合视图，而不是表视图。 以下是目前的scss和查看文件。 你能告诉我如何在rails上实现集合视图吗？

#app/assets/stylesheets/custom.css.scss 

.questions { 
    list-style: none; 
    margin: 30px 0 0 0; 
    color: #000000; 
    // width:300px; 
    // height:100px; 
    // background:gray; 
    box-shadow: 0 2px 4px 4gba(0,0,0,0.2); 

    div { 
    display:inline; 
    } 

    li { 
    padding: 50px 0; 
    border-top: 1px solid #e8e8e8; 
    } 
} 
.content { 
    display: block; 
} 

#app/views/questions/show.html.erb 
<div class="row"> 
    <div class="span8"> 
    <h3>Popular</h3> 
    <div class = "questions"> 
     <%= render @questions %> 
    </div> 
    </div> 
</div> 

图片1

图片2

Answer 1

你需要阅读引导的doc（http://getbootstrap.com/css/）。您可以使用Boostrap的缩略图并修改样式。通过像我一样添加col-md-4，每行就会有3个问题。

<div class="row"> 
    <h3>Popular</h3> 
    <%= render @questions %> 
</div> 

在_question.html.erb：

<div class="col-md-4"> 
    <%= link_to question, class: "thumbnail" do %> 
     <%= image_tag question.image %> 
    <% end %> 
    </div>