Question

HTML：

<div class="red">
    <input type="text" value="text" disabled="disabled">
    <select disabled>
        <option>aaa</option>
        <option>aaa</option>
    </select>
</div>
<div>
    <input type="text" value="text" disabled="disabled">
    <select disabled>
        <option>aaa</option>
        <option>aaa</option>
    </select>
</div>

CSS：

div.red input[type=text],
div.red select{
    color: red;
}
div.red input[type=text][disabled],
div.red select[disabled]{
    color: none;
}

我可以写什么css禁用输入删除红色？我不能'设置颜色，因为禁用输入看起来不太好。我想在CSS中设置它。

Answer 1

没有任何名为color:none;

的内容

div.red input[type=text][disabled],
div.red select[disabled]{
    color: black;
}

要恢复默认颜色使用：

color:GrayText;

CSS系统颜色关键字 - link

CSS系统颜色关键字是一种使用CSS来设置样式的方法文件使他们融入你的环境客户正在使用。你知道，而不是准确地指定颜色用户代理使用系统上定义的颜色。

Answer 2

我不相信跨浏览器，只有在CSS中指定文本颜色后才能将文本颜色重置为initial state。禁用输入时，您必须删除red类。

否则，您可以强制某个特定的color和background-color处于禁用状态，以实现跨浏览器的某种级别的奇偶校验。

input[type=text][disabled],
select[disabled] {
    color: #545454 !important;
    background-color: #EBEBE4 !important;
}

但请注意，表单元素有许多其他默认样式。你不能指望到处都看起来完全一样。

jsfiddle

Answer 3

保持简单。使用:not()伪类。

请参阅DEMO。

div.red input[type=text]:not([disabled]),
div.red select:not([disabled]){
    color: red;
}

Answer 4

color: none不是有效颜色。使用hex，rgb或任何css有效颜色。如果您希望文本不可见，请使用color: transparent;。

为了让颜色回归到元素的原始颜色或禁用的状态，可以使用color: initial;。请参阅here。

Answer 5

在你的jsfiddle第三个javascript行中：

$('input[type=text], select').attr('disabled', 'disabled').css('color', 'grey');

如何删除禁用输入中的字体颜色

5 个答案:

CSS系统颜色关键字 - link