曲径通幽论坛

标题: 下拉列表样式应用举例 [打印本页]
作者: beyes    时间: 2015-12-25 21:00
标题: 下拉列表样式应用举例
下面应用样式生成一个彩色的下拉列表，考察下面代码：
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <title>下拉菜单</title>

  7.         <style type="text/css">
  8.                 select { border:none; background-color:#09C; }
  9.                 .p1 { background-color:#FF9; }
  10.                 .p2 { background-color:#CC6; }
  11.                 .p3 { background-color:#F93; }
  12.     </style>

  14. </head>

  16. <body>
  17.         <select name="">
  18.             <option value="北京" class="p1">BeiJing</option>
  19.         <option value="上海" class="p2">ShangHai</option>
  20.         <option value="广州" class="p3">GuangZhou</option>
  21.      </select>

  23. </body>
  24. </html>
复制代码

效果图：
[attach]4267[/attach]上面代码只是针对每一个下拉选项设置了一个背景色。







欢迎光临 曲径通幽论坛 (http://www.groad.net/bbs/) Powered by Discuz! X3.2