【问题标题】:CSS: How to change font color for a specific disabled field?CSS:如何更改特定禁用字段的字体颜色?
【发布时间】:2018-03-13 12:12:58
【问题描述】:

我找到了几个关于如何使用下面的代码更改所有禁用字段的字体颜色的主题:

input[disabled=disabled] {
 /* your style */
 color: #fff !important;
}

但我有几个禁用的字段,我只想更改目标字段的颜色。那么如何向此脚本添加按 ID 定位的目标呢?感谢您的帮助!

【问题讨论】:

  • 将一个类添加到您想要设置样式并使用它的类中

标签: html css disabled-input


【解决方案1】:

为您的ID 切换input 选择器:

#thisOne[disabled=disabled] {
 color: #fff !important;
 background: red;
}
<input id="thisOne" disabled="disabled" value="Lorem ipsum">

<input id="notThisOne" disabled="disabled" value="Lorem ipsum">

一个类可能更有意义,以便您可以重用样式:

.these[disabled=disabled] {
 color: #fff !important;
 background: red;
}
<input class="these" disabled="disabled" value="Lorem ipsum">
<input class="these" disabled="disabled" value="Lorem ipsum">

<input class="notThese" disabled="disabled" value="Lorem ipsum">

【讨论】:

  • 感谢您的快速响应!我确信您的代码有效,但可能我遗漏了一些东西。我正在使用下一个代码: 我正在尝试更改输入字段的字体颜色。我也尝试过上课,例如 .myclass[disabled=disabled]... 但仍然无法正常工作。你有什么建议吗?
  • 我必须看看你的 html。你能在 jsfiddle.net 上创建一个简单的例子吗?
  • 我正在使用共享点,所以自动生成的 ID 非常恶心。我正在使用按 F12+单击文本框来查找正确的 ID。我在这里添加了文本框的 html 和我的 CSS 代码。非常感谢您的帮助,并为您带来的麻烦感到抱歉。 jsfiddle.net/tm7otm8L
  • 您的 id 包含一个美元符号 ($)。您需要在选择器中使用反斜杠 (\ ) 将其转义。此外,由于您的disabled 属性值为空,您应该将选择器从[disabled=disabled] 更改为仅[disabled]。我已经更新了您的示例:jsfiddle.net/tm7otm8L/1
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2011-07-10
  • 2017-07-12
  • 2011-09-05
  • 1970-01-01
  • 2019-12-24
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多