基于数据库信息的动态CSS

发布于 2024-10-30 06:33:17 字数 125 浏览 2 评论 0原文

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

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

如何你做这样的事吗？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

诗笺 2024-11-06 06:33:17

听起来咳咳表格很好用！

问题是您无法通过更改 CSS 来做到这一点，您需要更改 HTML

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

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

Sounds like a good use of ahem TABLEs!

The issue is you can't do this by changing the CSS, you need to change the HTML

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

By default all table cells (TD) will be of equal width.

回复收藏 0 原文

伊面 2024-11-06 06:33:17

您需要在 .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>

You need to dynamically assign styles in your .html.erb. You can use, tables, divs, lists - whatever you want. Just assign different classes depending on the number of columns (class="small", class="wide") and define those in your CSS file OR (possibly less pretty) you can use inline-styles.

For example, in this code I assign the width of an element (to do a five-star rating):

<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>

Edit: if you set the class as a variable in the controller this would be an example for the view: