0

基本上我希望我的按钮的背景颜色是表单背景颜色的较暗阴影，这由我正在访问的“编辑”视图的对象的颜色属性决定。目前我正在使用

<div class="formPageBG" id="formPageBG" style="background-color: <%=@student.color%>">

访问时动态设置背景颜色。但是，我不确定如何在我的按钮上访问相同的内联样式属性，该属性由

<div class="action">
  <%= f.submit "Update" %>
</div>

此按钮通过 .action:input 在 CSS 中设置样式，但我无法从我的 CSS 表访问 @student 变量。我已经研究了很多不同的方法来尝试解决这个问题，比如将数据传递给 Javascript 或使用 Javascript 中的 SASS 变量，但我不知道如何正确地将 ruby​​ 变量放入 CSS 表中。我采用了内联样式，因为它是一个 .erb 文件，并且变量已经存在。我尝试了一些不同的语法，比如

<%= f.submit "Update", style: 'background-color:<%=@student.color%>'%>
<%= f.submit "Update", :style => 'background-color:<%=@student.color%>'}%>
<%= f.submit "Update", {:style => 'background-color:<%=@student.color%>;'}%>
<%= f.submit "Update", {:style => 'background-color:<%=@student.color%>'}%>

但这些都没有奏效。我还尝试仅复制此 ruby​​ 片段创建的 HTML 并对其进行内联样式设置，但这似乎也不起作用（如果这样做也会感到草率，因为我的表单的其余部分是由 form_for 生成的）。因此，要么我需要一种方法来从我的 CSS 表中访问 @student 变量（这将是理想的），要么我需要在我的 .erb 文件中对这个按钮进行内联样式。另外，如果我最终能够设置背景颜色的样式，是否知道如何通过 CSS 动态生成该颜色的较暗阴影？我可以使用 filter:contrast 或 filter:brightness 内嵌样式吗？

4

2 回答 2

0

"#{foo}"您可以使用 - （双引号、哈希和大括号）插入变量，因此在您的情况下，它将是：

<%= f.submit "Update", style: "background-color: #{@student.color} "%>
于 2016-07-05T07:12:56.567 回答
0

你应该这样做：

<%= f.submit "Update", style: "background-color: #{ @student.color }", class: "formPageBG",  id: "formPageBG"  %>
于 2016-07-05T07:13:31.837 回答