多彩下拉列表样式：
<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>多彩下拉菜单</title> <style type="text/css"> body{background-color:#999999;} select{ width:60px; } form{ color:#FFFFFF; font-size:16px; font-weight:800px; font-family:"新宋体"; } .r{background-color:#FF0000; color:#000;} .o{background-color:#FF9900; color:#000;} .y{background-color:#FFFF00; color:#000;} .g{background-color:#009900; color:#000;} .q{background-color:#21b9b4; color:#000;} .b{background-color:#0000FF; color:#000;} .z{background-color:#7c176a; color:#000;} </style> </head> <body> <form action=""> <label for="color">请你选择你喜欢的一种颜色:</label> <select name="" id="color"> <option class="r">红</option> <option class="o">橙</option> <option class="y">黄</option> <option class="g">绿</option> <option class="q">蓝</option> <option class="b">锭</option> <option class="z">紫</option> </select> </form> </body> </html>
样式显示：
