Clear css style from a select for disable
so, I have a page which uses a css stylesheet which unfortunately, I can't modify, This contains:
select {
color: #333333;
background-color: #FAFAFA;
font-family: "Lucida Grande", Verdana, Helvetica, sans-serif;
font-size: 1.1em;
font-weight: normal;
border: 1px solid #A9B8C2;
padding: 1px;
}
In the same page, I have a
<select id='myid' style='width:400px;'>
which is disabled (I开发者_C百科 tried both disabled in HTML with disabled or JS' element.disabled = true with the same result).
The problem is that the select due to the CSS inherited does not look disabled at all (even if it is infact disabled).
How can I best clear the CSS style inherited so that my select, once disabled looks like this? I do not necessarily want to drop the current style, apart from the unwanted side-effect.
Thanks!
so, I have a page which uses a css stylesheet which unfortunately, I can't modify
If you can't modify the stylesheet that sets this:
select {
background-color: #FAFAFA;
border: 1px solid #A9B8C2;
}
It's impossible to revert the <select> back to the native version.
The problem is that the select due to the CSS inherited does not look disabled at all (even if it is infact disabled).
In that case, I think you should do this:
select[disabled] {
border: 1px solid red;
/* whatever you want a disabled select to look like */
}
You could re-define some CSS in a script block in your HTML to override the css style along these lines:
<html>
...your existing file
<script type="text/css">
....my new styles to override the ones I can't change
</script>
</html>
Whilst this isn't ideal, it would likely get around this particular problem.
<SELECT> doesn't accept CSS styling like other tags because it is rendered by the operating system, not HTML. That's why it looks different on a MAC/PC etc.
Try setting the color and background color explicitly inline something like below:
<select id='myid' style='width:400px; backgound-color: ####'>
Hope this helps!!
加载中,请稍侯......
精彩评论