Question

我在我的CSS文件中有这个样式，它以表格形式输入输入字段：

input,textarea,input,select,input,checkbox {
    font-size:12px;
    font-family:Verdana,Arial,Helvetica,sans-serif;
    color:#98925C;
    background-color:#000;
    border:1px solid #413E22;
}

当我在表单上使用disabled时（例如，按下时提交按钮），它不会像应该的那样变灰。

我在提交按钮HTML

中有这个

onclick="this.disabled=true;this.value=' done ';this.form.submit();"

如何点击该按钮会使其变灰？

Answer 1

它在IE中变灰了。但是，对于其他浏览器，您需要使用以下命令专门定义“禁用元素”样式：

:disabled {
    color: #6b849a;
    text-shadow: 1px 1px #ffffff;
    cursor: default;
}

类似的东西（尽管如果存在级联问题，您可能必须应用!important。）

Answer 2

问题是您的样式会覆盖已禁用表单元素的浏览器默认值。

您需要通过在CSS中指定:disabled伪类来重新定义样式。

这是一个显示其工作原理的jsFiddle。

Answer 3

input[disabled]{
  styles here
}

Answer 4

使用:disabled pseudoclass。这可能在旧浏览器中不起作用，肯定不能在IE中工作，所以你也可以在禁用它时为表单添加一个普通的类。

用于禁用表单输入的CSS

4 个答案: