下拉选择值背景色 [英] dropdown selected value background color
本文介绍了下拉选择值背景色的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
当我像这样使用时..
< 选择 id =" runat =" >
< 选项 > 全部< /option >
< 选项 > 学校< /option >
< 选项 > 学院< /option >
< 选项 > StudentProducts < /option >
< 选项 > 公共汽车< /option >
< 选项 > 个人护理< /option >
< /select >
在选择项目选择项目的背景颜色变为蓝色color.Now我想这不应该发生那样的情况帮我解决这个问题..
解决方案
<预lang ="xml"> < html >> < 头部 > < 样式 =" text/css" < /style > < /head > < 选择 > < 选项 =" 项目1" 类 >红色" > 项目1 < /option > < 选项 =" 项目2" class 蓝色" > 项目2 < /option > < 选项 =" 项目3" class 白色" > 项目3 < /option > < /select > < /html >
或
您需要一些JavaScript才能在其他浏览器中工作:
< 选择 更改 ="
使用CSS类名称更好:
< 选择 > ; onchange ="this.className = this.options [this.selectedIndex] .className" class ="important"> < 选项 =" 重要" 已选择 已选择" > 项目1 < /option > < 选项 =" sorta-important" < > < /select >
还有您的CSS:
.重要 {背景色 黄色； } .排序重要 {背景色 : 浅黄色； }
When I am using as like this..
<select id="Category_DD" runat="server" >
<option>All</option>
<option>School</option>
<option>College</option>
<option>StudentProducts</option>
<option>Bus</option>
<option>Personal Care</option>
</select>
When selecting Item selected item background color change to blue color.Now I want to this should not be happen.Please help me to solve this problem..
解决方案
<html> <head> <style type="text/css"> option.red {background-color:red} option.blue {background-color:blue} option.white {background-color:white} </style> </head> <select> <option value="item 1" class="red">Item 1</option> <option value="item 2" class="blue">Item 2</option> <option value="item 3" class="white">Item 3</option> </select> </html>
or
You''ll need some JavaScript for it to work in other browsers:
<select onchange="this.style.backgroundColor=this.options[this.selectedIndex].style.backgroundColor"> <option style="background-color:yellow">Item 1</option> <option style="background-color:lightyellow">Item 2</option> </select>
Even nicer with css class names:
<select> onchange="this.className=this.options[this.selectedIndex].className" class="important"> <option class="important" selected="selected">Item 1</option> <option class="sorta-important">Item 2</option> </select>
And your css:
.important { background-color:yellow; } .sorta-important { background-color:lightyellow; }
这篇关于下拉选择值背景色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
