CSS選擇元素，如何消除箭頭？

我想爲我的頁面上的select元素提供一個很好的樣式。所以我創建了一個CSS：CSS選擇元素，如何消除箭頭？

.selectWebDropDown 
{ 
    background-color:Transparent; 
    background: url(../Images/ddl_Normal.png) no-repeat right #FFFFFF !important; 
    border: 0px solid #FFFFFF; 
    padding:4px; 
    line-height: 21px; 

} 

.selectWebDropDown:hover 
{ 
    background-color:Transparent; 
    overflow: hidden; 
    background: #FFFFFF url(../Images/ddl_Hover.png) no-repeat 0 0 !important; 
    padding:4px; 
    line-height: 21px; 
} 

.selectWebDropDown:active 
{ 
    overflow: hidden; 
    background-color:Transparent; 
    background: url(../Images/ddl_Pressed.png) no-repeat 0 0 !important; 
    padding:4px; 
    line-height: 21px; 
}

的風格是好的，問題是，選擇的方向不dissapear ......有沒有辦法做到這一點不使用JavaScript ...只有css

來源

2012-02-21 jcvegan

你有沒有試過添加一個以普通圖片爲背景的已訪問樣式？ – evasilchenko 2012-02-21 22:29:27

<select>元素是非常難以風格，特別是如果你想跨瀏覽器一致性。不幸的是，我會去JavaScript路線並使用列表進行下拉式替換。

嘗試一個jQuery插件，如this或this。

來源

2012-02-21 22:30:18 mikos

你是怎麼做到的？ – jcvegan 2012-02-21 22:34:41

你可以編寫自己的，或者使用jQuery插件，如[this]（http://harvesthq.github.com/chosen/）或[this]（http://www.adamcoulombe.info/lab/jquery/選擇框/）。 – mikos 2012-02-21 22:40:39

你的答案正常工作...你可以把它作爲回答來標記它嗎？ – jcvegan 2012-02-21 23:13:07

CSS選擇元素，如何消除箭頭？

回答

相關問題