更改組合框風格

Question

我想改變cmbobox設計我rtied使用此代碼它的工作對鉻 但它不工作的Opera和Firefox HTML代碼：

<div class="styled-select"> 
    <select> 
     <option>Here is the first option</option> 
     <option>The second option</option> 
    </select> 
</div> 

CSS代碼：

.styled-select select { 
     background: transparent; 
     width: 268px; 
     padding: 5px; 
     font-size: 16px; 

     border: 0; 
     border-radius: 0; 
     height: 34px; 
     -webkit-appearance: none; 
     -moz-appearance:none; 
     appearance: none; 
     } 

.styled-select { 
     width: 271px; 
     height: 43px; 
     overflow: hidden; 
     background: url(img/cmbbox.png) no-repeat; 
     border: 0; 
     } 

的jsfiddle：選擇元素http://jsfiddle.net/Sz2e6/

Answer 1

完全CSS樣式是僅適用於Chrome瀏覽器的支持。有關詳細信息，請參閱此question的第二個答案。

由於該答案已發佈，Firefox已獲得樣式選擇的一些支持，但並非所有樣式選項都可用。

對於跨瀏覽器的解決方案，正常的方法是隱藏選擇和風格的另一個元素看起來像一個選擇控制。