Question

我想知道如何根据数据库中的元素数量动态更改我的CSS样式。

用户可以选择一定数量的列，并且他们选择的列数决定了列的宽度（显然，选择的列越多，每列的宽度就越小，以便它们在水平方向上均匀分布。页。

你怎么做这样的事情？

Answer 1

听起来很好用 ahem TABLE！

问题是您无法通过更改CSS来执行此操作，您需要更改HTML

<table width="100%">
  <tr>
      <td>..</td> (repeat for the number of columns)
  </tr>
</table>

默认情况下，所有表格单元格（TD）的宽度都相等。

Answer 2

您需要在.html.erb中动态分配样式。您可以使用，表格，div，列表 - 无论您想要什么。只需根据列数（class =“small”，class =“wide”）分配不同的类，并在CSS文件中定义它们（或者可能不那么漂亮），你可以使用内联样式。

例如，在此代码中，我指定元素的宽度（进行五星评级）：

<ul class="stars floatstars">
        <li class="yellowstars" style="width: <%= @article.avg_rating * 25 %>px !important;"></li>
        <li class="text"><%= @article.avg_rating %> average from <%= pluralize(@article.count_ratings, "vote") %></li>
</ul>

编辑：如果您将类设置为控制器中的变量，则这将是视图的示例：

<li class=<%= @myclass %>>...</li>

基于数据库信息的动态CSS

2 个答案: