css修改select控件样式的简单例子(兼容IE6、IE7、Firefox)

发布时间:2019-09-27编辑:脚本学堂
分享一例css代码,用于修改select下拉列表的样式,可以兼容兼容IE6、IE7、Firefox浏览器,有需要的朋友参考下。

本节内容:
css修改select样式

1,css样式代码
 

复制代码 代码示例:
<style type="text/css">
<!--
.select { margin: 0; padding: 0; border:1px solid #cccccc; float: left; display: inline; }
.select div { border:1px solid #f9f9f9; float: left; }
.select>div { overflow: hidden; }
* html .select div select { display:block; float: left; margin: -2px; }
.select div>select { display:block; float:none; margin: -2px; padding: 0px; }
.select:hover { border:1px solid #666; }
-->
</style>

2,html内容部分
 

复制代码 代码示例:
<div class="select">
<div>
 <select>
  <option>脚本学堂</option>
  <option>天天爱猜图答案</option>
  <option>网站编程</option>
 </select>
</div></div>