Question

我使用each_with_index在我的主页上显示用户排名前5的排名。我只设法将一种全局风格应用于5个等级。

<% @users_by_roi.take(5).each_with_index do |user, index| %>
  <div><class="ranking"> <%= index + 1 %></div>
  <div class="text-center">
    <%= link_to (image_tag user.picture.url(:medium), class: "small-avatar"), user_path(user) %>
  </div>
  <div><%= link_to "#{user.username}", user_path(user), class: "hot-tipster-link" %></div>
  <div class="green-roi"> + <%= user.roi.round(2) %> %</div>
<% end %>

如何将特定样式应用于1,2和3等级（金，银，铜）？

谢谢

Answer 1

实际上，在我看来，最好的方法是在你的CSS中，因为它是样式信息，与你一般显示的数据无关。

要做到这一点，我建议您查看n-th master网站，这是一个很好的参考。这是一个像你这样的标记的演示：

.wrapper {
  width: 100%;
}

.wrapper > div {
  background-color: blue;
  color: white;
  height: 25px;
  width: 500px;
}

.wrapper > div:first-child {
  background-color: gold;
}

.wrapper > div:nth-child(2) {
  background-color: silver;
}

.wrapper > div:nth-child(3) {
  background-color: red;
}

<div class="wrapper">
  <div>1. </div>
  <div>2. </div>
  <div>3. </div>
  <div>4. </div>
  <div>5. </div>
</div>

枚举时使用不同的样式（使用each_with_index）

1 个答案: