I have simple JQuery Mobile form where I have textfields that could be disabled or enabled depending on some conditions. Normal enabled textfield looks like this:
我有简单的JQuery移动表单,其中有可以根据某些条件禁用或启用的textfield。普通启用的textfield如下所示:
and disabled looks like that:
残疾人是这样的:
I'd like to make the text in the disabled field a bit more readable. How can I do this?
我想让禁用字段中的文本更具可读性。我该怎么做呢?
HTML
HTML
<asp:Label ID="lblCityPostal" AssociatedControlID="txtCityPostal" runat="server"
Text="City"></asp:Label>
<div class="clear">
</div>
<asp:TextBox ID="txtCityPostal" runat="server">
Solution
解决方案
As suggested below I'm now using the following CSS:
如下所示,我现在使用以下CSS:
input.regTxt:disabled {
font-weight:bold;
}
I've added CssClass="regTxt"
to all my text fields.
我已经将CssClass="regTxt"添加到所有文本字段中。
3 个解决方案
#1
3
Use :disabled
selector. For example:
用途:禁用选择器。例如:
input:disabled {
color: #444;
border: 1px solid #888;
}
See this Fiddle for a demo: http://jsfiddle.net/A9CN8/
请参阅此小提琴的演示:http://jsfiddle.net/A9CN8/。
All notable modern browser support :disabled, but for Internet Explorer 8 and below you are out of luck: for those browsers you cannot change the look of disabled controls.
所有值得注意的现代浏览器支持:已禁用,但对于Internet Explorer 8和以下浏览器来说,您不太可能改变禁用控件的外观。
#2
4
You can use :disabled
您可以使用:禁用
input[type="text"]:disabled {
/* This may lack browser support so go for the next selector*/
border: 1px solid #f00;
}
演示
Or you can also use element[attr=val]
selector
也可以使用元素[attr=val] selector
input[type="text"][disabled="disabled"] {
border: 1px solid #f00;
}
演示2
#3
1
Use the :disabled
selector
使用:禁用选择器
input:disabled {
color: your_color;
}
#1
3
Use :disabled
selector. For example:
用途:禁用选择器。例如:
input:disabled {
color: #444;
border: 1px solid #888;
}
See this Fiddle for a demo: http://jsfiddle.net/A9CN8/
请参阅此小提琴的演示:http://jsfiddle.net/A9CN8/。
All notable modern browser support :disabled, but for Internet Explorer 8 and below you are out of luck: for those browsers you cannot change the look of disabled controls.
所有值得注意的现代浏览器支持:已禁用,但对于Internet Explorer 8和以下浏览器来说,您不太可能改变禁用控件的外观。
#2
4
You can use :disabled
您可以使用:禁用
input[type="text"]:disabled {
/* This may lack browser support so go for the next selector*/
border: 1px solid #f00;
}
演示
Or you can also use element[attr=val]
selector
也可以使用元素[attr=val] selector
input[type="text"][disabled="disabled"] {
border: 1px solid #f00;
}
演示2
#3
1
Use the :disabled
selector
使用:禁用选择器
input:disabled {
color: your_color;
}