1. 程式人生 > >如何設定Select下拉選擇框(選單)的樣式

如何設定Select下拉選擇框(選單)的樣式

 

增加CSS樣式:

<style type="text/css">
.select{border:1px #004080 solid;float: left;}
.select div{border:1px #efefef solid;float: left;}
.select div select{display:block;float:left;margin:-2px;font-family:Verdana,Arial; font-size: 11pt; color: #FF0000}
</style>

在下拉選單的前後加上<div>標記,如:

<div class="select">
<div>
<select>
<option>設定樣式後的選擇框文字</option>
<option>設定樣式後的選擇框文字</option>
<option>設定樣式後的選擇框文字</option>
</select>
</div>
</div>

設定後的效果如下: