CSS 类使用 textarea 但不使用输入文本答案

【问题标题】：CSS class working with textarea but not with input textCSS 类使用 textarea 但不使用输入文本
【发布时间】：2013-10-10 18:25:32
【问题描述】：

我有一个 CSS 类定义如下：

.form_bg_color{ background: red; }

在我看来，我有以下表格行：

<%= f.text_field :source, class: "form_bg_color" %>

这应该会改变输入框的颜色，但是不起作用。

所以我做了一些测试。我将表格行更改为：

<%= f.text_field :source, style: "background:red;" %>

这行得通。此外，改用 text_area 并且该类也可以工作：

<%= f.text_area :source, class: "form_bg_color" %>

谁能告诉我为什么 text_field 不接受我的课？

【问题讨论】：

除非问题与模板代码本身有关，否则只提供生成的HTML。
我会发布，但 html 很好。它正在正确生成 div 和类。就像马克在下面所说的那样，我想这是具有特殊性的东西。
你应该提供足够的代码来复制问题，否则很难调试。模板代码和一行 CSS 不能做到这一点。
我在 rails 中没有 CSS 自定义表单。如果我有，我会发布生成的 html 或我的 CSS。我唯一的 CSS 是 form_bg_color。如果你已经在 Rails 中编程（即使像我这样的时间很短），那么你就会知道 html 会是什么样子。就像我说的，html 很好。我在浏览器上调试了它。问题是我不知道 CSS 如何计算冲突属性的优先级，而不是生成的 html。

【解决方案1】：

我认为您的 CSS 特定性冲突导致您的类 .form_bg_color 无法生效。

如果类本身，例如：

<%= f.text_field :source, class: "form_bg_color" %>

不起作用，但内联样式有效：

<%= f.text_field :source, style: "background:red;" %>

然后有另一个更高特异性的 CSS 规则生效。

您可能需要尝试以下方法：

input.form_bg_color {}

但您需要查看选择 input 字段的其他样式。

该类在textarea 上工作的事实可能相关，也可能不相关。

有关 CSS 选择器的特殊性的更多信息，
见：http://www.w3.org/TR/CSS2/cascade.html#specificity

【讨论】：