css改变下拉菜单颜色

实例介绍

css改变下拉菜单颜色

一般的下拉菜单多半背景颜色为白色，这里讲述的高级技巧是可以将下拉菜单的每一个块

都变成不同的颜色，让页面颜色更丰富。

实例代码

htmlheadtitle改变下拉菜单颜色/titlemeta http-equiv="Content-Type" content="text/html; charset=gb2312"style type="text/css"!--body，td，th u00a0color: #CC0066;u00a0font-size: 9pt;u00a0text-align: center;body u00a0background-color: #5FBC47;u00a0background-image: url;

.style1 color: #FFFFFF

.green background-color:#CCFFCC;color:# u00a0background-color:#B0FFB0;u00a0color:#;.grassgreen u00a0background-color:#CCFF99;u00a0color:#;.middlegreen u00a0background-color:#CCFF66;u00a0color:#;.darkgreen u00a0background-color:#33CC66;u00a0color:#FFFFFF;--/style/headbodyu00a0 span class="style4 style1"我的职业：/spanselect name="select"u00a0u00a0u00a0 option selected class="green"学生/optionu00a0u00a0u00a0 option class="lightgreen"白领/optionu00a0u00a0u00a0 option class="middlegreen"教师/optionu00a0u00a0u00a0 option class="grassgreen"公务员/optionu00a0u00a0u00a0 option class="darkgreen"下岗人员!/optionu00a0 /select/body/html

代码分析

上面的代码首先定义了green、lightgreen、middlegreen、grassgreen、darkgreen等样式。然

后对下拉菜单中的option标签分别应用不同的样式，其浏览效果如图15．11所示。

素材及源码下载