如何使用 CSS 更改禁用输入的字体颜色？

在开发 Web 应用程序时，通常会需要禁用输入字段，以防止用户对特定数据进行修改。默认情况下，浏览器会为禁用的输入字段应用灰色文本颜色和背景色，以凸显它们已被禁用。但是，如果您希望更改禁用输入的字体颜色，可以通过 CSS 样式来实现。

禁用输入字段的 CSS 样式

以下是一些样式规则，可用于更改禁用输入的字体颜色：

input[type="text"]:disabled {
  color: #999;
}

• input[type="text"]：此选择器选取所有文本输入字段。
• :disabled：这个伪类选取所有已禁用的元素。
• color: #999：这个规则将禁用输入字段的文本颜色更改为灰色。

此外，您还可以更改禁用输入字段的背景色，使用以下样式：

input[type="text"]:disabled {
  color: #999;
  background-color: #eee;
}

• background-color: #eee：这个规则将禁用输入字段的背景颜色更改为浅灰色。

将样式应用于所有禁用的输入字段

如果您希望将样式应用于所有禁用的输入字段，而不仅限于文本输入字段，可以使用以上样式规则的通用选择器版本如下：

:disabled {
  color: #999;
  background-color: #eee;
}

这个规则没有特定的选择器，所以它将应用到所有已禁用的元素。

结论

通过使用 CSS 样式规则，您可以更改禁用输入字段的字体颜色和背景颜色，以适应您的 Web 应用程序的外观和感觉。