ruby-on-rails - 如何在 Rails 中创建动态 CSS?

标签 ruby-on-rails css dynamic-css

使用 Rails 创建动态 CSS 的最佳/最有效方法是什么。我正在网站上开发一个管理区域,我希望用户能够自定义其配置文件的样式(主要是颜色),这些样式也将被保存。

你会在 css 文件中嵌入 ruby​​ 脚本吗? 您需要更改 css 的文件扩展名吗?

谢谢。

最佳答案

在 Rails 3.1 中,您可以让 erb 预处理您的样式表。

现在假设您在 app/ Assets /样式表。它将由 erb(然后由 Sass)处理,因此可以包含诸如

.some_container {
    <% favorite_tags do |tag, color| %>
    .tag.<%= tag %=> {
        background-color: #<%= color %>;
    }
    <% end %>
}

您可以像包含任何样式表一样包含它。

它应该有多动态?

请注意,它只会被处理一次,因此如果值发生变化,样式表也不会。

我认为目前还没有 super 有效的方法让它完全动态化,但仍然可以为所有请求生成 CSS。考虑到这一点,在 Rails 3.1 中有一个帮助程序:

  def style_tag(stylesheet)
    asset = YourApplication::Application.assets[stylesheet]
    clone = asset.class.new(asset.environment, asset.logical_path, asset.pathname, {})
    content_tag("STYLE", clone.body.html_safe, type:"text/css")
  end

使用方法如下:

首先,将上面的助手复制到app/helpers/application_helper.rb

然后您可以将其包含在您的页面中,如下所示:

<% content_for :head do %>
  <%= style_tag "dynamic.css" %>
<% end %>
The rest of your page.

确保您的布局使用内容 :head。例如,您的 layout/application.html.erb 可能如下所示:

...
<HEAD>
  ....
  <%= yield :head %>
</HEAD>
...

感谢 this post,我发现了这一点.

关于ruby-on-rails - 如何在 Rails 中创建动态 CSS?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3556915/

相关文章:

ruby-on-rails - elasticsearch-rails VS (re)tire gem (Elasticsearch and Rails 3.2)

ruby-on-rails - 如何使用动态属性对问卷数据库关系建模

ruby-on-rails - 如何在erb中编写while循环

html - 去除隐藏和显示中的空白 :none input elements

css - 生成类似 Google Fonts 的 CSS 文件

jquery - :remote=>true not doing AJAX call

html - 表不适合父 div

javascript - 为什么在 DOM 中移动元素会阻止 CSS 转换的发生?

javascript - 将CSS类名转换为随机字母

css - Facebook 喜欢状态 div