如何解决HTML下拉列表项目的背景色
| 我有一个包含项的下拉菜单，我想使用ODD和EVEN来替代颜色。 我的问题是...用于设置下拉列表项目样式的CSS代码是什么？解决方法
使用CSS nth-child伪类：
<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
<html xmlns=\"http://www.w3.org/1999/xhtml\" xml:lang=\"en\" lang=\"en\">
<head>
<title>HTML Dropdown list item baground colors</title>
<style type=\"text/css\">
#myForm select option:nth-child(odd) {
color:black;
background:yellow;
}
#myForm select option:nth-child(even) {
color:white;
background:blue;
}
#myForm select {
background:green;
color:orange;
}
</style>
</head>
<body>
<form id=\"myForm\" action=\"#\" method=\"get\">
<select>
<option>A</option>
<option>B</option>
<option>C</option>
<option>D</option>
<option>E</option>
<option>F</option>
</select>
</div>
</body>
</html>
#o1{background:red;}
#o2{background:green;}
#o3{background:#FFEA76;}
<option id=\"o1\">blah 1</option>
<option id=\"o2\">blah 2</option>
<option id=\"o3\">blah 3</option>
.nav{
padding: 0;
list-style: none;
}
.nav li{
color: #c1a404;
background: #007e96;
padding: 10px;
font-size: 20px;
font-family: Futura,sans-serif;
}
.nav li:nth-child(even) {
color: white;
background: dodgerblue;
}<ul class=\"nav\">
<li>Home</li>
<li>About Us</li>
<li>News</li>
<li>Careers</li>
<li>Contact</li>
</ul>
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
