禁用样式 <select>(下拉框)在 HTML [英] Styling disabled &lt;select&gt; (dropdown boxes) in HTML

查看:23
本文介绍了禁用样式 <select>(下拉框)在 HTML的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我们的一位客户很难阅读我们基于 Web 的应用程序中禁用控件中的灰色文本:

One of our customers has a hard time reading the grey text in disabled controls in our web-based application:

我们想将样式更改为浅灰色背景和黑色文本.不幸的是,大多数浏览器(包括客户使用的 IE)都忽略了禁用控件上的 color: ... CSS 属性,因此我们无法更改前景色.

We would like to change the style to a light grey background and a black text. Unfortunately, most browsers (including IE, which is what the customer is using) ignore the color: ... CSS attribute on disabled controls, so we cannot change the foreground color.

对于文本框 (input type="text"),这可以通过使用 readonly 而不是 disabled 属性轻松解决.不幸的是,这不是下拉菜单(select)或复选框(input type="checkbox")的选项.

For text boxes (input type="text"), this can easily be workarounded by using the readonly instead of the disabled attribute. Unfortunately, this is not an option for dropdowns (select) or checkboxes (input type="checkbox").

有什么简单的解决方法吗?最好是不需要用另一种类型的控件替换控件的控件?(...因为我们的控件是由 ASP.NET 呈现的)

Is there an easy workaround for that? Preferebly one where the control does not need to be replaced by another type of control? (...since our controls are rendered by ASP.NET)

PS:在 CSS 中使用 [disabled] 选择器没有区别.

PS: Using the [disabled] selector in CSS does not make a difference.

推荐答案

在 Internet Explorer 9 中,将添加对 :disabled 伪选择器(参考).我不知道这是否会尊重颜色"属性,但似乎很有可能.

In Internet Explorer 9, support will be added for the :disabled pseudo-selector (ref). I don't know whether that will honor the "color" property, but it seems likely.

在旧版本的 IE 中,您可以调整背景颜色(但不能调整颜色).因此:

In older versions of IE, you can adjust the background color (but not the color). Thus:

    <style type="text/css">
        select[disabled] { background-color: blue; }
    </style>

这适用于 IE 7 和 IE 8.您仍然无法更改前景色,但您可以更改背景色,以与 IE 在禁用时为其分配的灰色形成更强烈的对比.

That works in IE 7 and IE 8. You still can't alter the foreground color, but you can change the background color to contrast more strongly with the gray that IE assigns it when it's disabled.

这篇关于禁用样式 <select>(下拉框)在 HTML的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆