ruby-on-rails - 枚举时的不同样式(使用 each_with_index)

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>