如何修改select的子元素option的默認樣式

div?class="selectbox"

我們提供的服務有：成都網站建設、成都做網站、微信公眾號開發(fā)、網站優(yōu)化、網站認證、福山ssl等。為近1000家企事業(yè)單位解決了網站和推廣的問題。提供周到的售前咨詢和貼心的售后服務，是有科學管理、有技術的福山網站制作公司

select

option默認值/option

option選項之/option

/select

/div

css代碼：

.selectbox{?width:?200px;?display:?inline-block;?overflow-x:?hidden;?height:?28px;?line-height:?28px;?font-size:?0;??background:#fff?url(images/selectbg.png)?right?center?no-repeat;?border:?1px?solid?#dcdbdb;?vertical-align:?middle;}

.selectbox?select{cursor:?pointer;?padding:?0?8px;?height:?28px;?line-height:?28px;?font-size:?12px;?width:118%;?padding-right:?18%;?background:none;?border:?none;}

.selectbox?select?option{?padding:5px;}

1..selectbox select? 有個padding-right:18%； 和寬度100%+18% 的意思是故意超出selectbox的。

2.這個超出部分剛好能把后面的默認下拉按鍵隱藏掉，同時設置.selectbox的背景為下拉小按鈕，居右邊垂直居中。

3.之所以用百分比(18%)，沒有用固定值設置超出，是因為外層的selectbox只要定寬就不必考慮內層的select的寬度和padding樣式值，很利于設置不同的寬度值，這里只需要設置selectbox的寬度，內層的select控件就自動獲得寬度并超出。

最終效果如下：

selectbg.png背景圖片如下：

如何修改select的option樣式

css設置下拉列表(select)樣式首先我們需要獲取到這個元素的id或者是class，然后在通過給這個元素設置它的width和height等等一些樣式，具體的看代碼: .div1{ width:600px; height:200px; font-size:13px; } .div select{ width:200px; } .div sel

純css怎么修改option內的樣式

方法：在 select標簽里面加上 color=#任意16進制數字可以改字體顏色，加上background color可以改背景顏色。

怎么修改select option樣式

1、首先看一下沒有（background-color）屬性的選擇下拉框的效果。

代碼：

選擇

option 123 / option

option blue / option

option黃色/ option

option紅包/ option

/選擇

2、要在選擇下拉框中添加背景顏色，首先我們需要先編寫樣式樣式，這樣便于調用。

樣式類樣式代碼：

style type =“text / css”

藍色 {

背景色：藍色;

顏色：#FFF;

red {

背景色：＃E20A0A;

顏色：#FFF;

}

黃色 {

背景顏色：黃色;

顏色：#fff;

}

/樣式

3、此時，我們的選擇下拉框調用樣式類樣式。

代碼如下：

選擇

option 123 / option

option class =“blue”藍色/ option

option class =“yellow”黃色/ option

option class =“red”紅包/ option

/選擇

4、此時，我們將背景顏色添加到選擇下拉框中。如下面的效果圖。