爲什麼我不能在選擇元素中更改插入符的顏色

Question

我在選擇元素中更改插入符的顏色時遇到問題。

我試圖從github庫插入元素插入符號，但那不能顯示，因爲選項標籤不支持其他html元素。

而且我在CSS中添加

-webkit-appearance:none; 
     -moz-appearance:none; 
     appearance:none; 

如何添加插入符不插入圖像

HTML

<select class="selectlokacija"> 

         <option value="volvo">Choose option <span><i class="fa fa-chevron-down location"></i></span></option> 
         <option value="saab">2002</option> 
         <option value="mercedes">2005</option> 
         <option value="audi">2008</option> 
        </select> 

CSS

.selectlokacija{ 
width:230px; 
padding:10px; 
color:white; 
background-color:#3E6373; 
font-size:15px; 
font-family: 'Roboto', sans-serif; 
border-radius:5px; 
-webkit-appearance:none; 
     -moz-appearance:none; 
     appearance:none; 

} 

Answer 1

如果我的理解是正確的

可以使用背景圖像選擇輸入如下所示

撥弄here

代碼

HTML

<select class="selectlokacija"> 
    <option value="volvo">Choose option</option> 
    <option value="saab">2002</option> 
    <option value="mercedes">2005</option> 
    <option value="audi">2008</option> 
</select> 

CSS

.selectlokacija { 
    width:230px; 
    padding:10px; 
    color:#fff; 
    background:#3E6373 url("http://s6.postimg.org/yzxyb2kv1/arrow.png") no-repeat 90% 50%;; 
    font-size:15px; 
    font-family:'Roboto', sans-serif; 
    border-radius:5px; 
    -webkit-appearance:none; 
    -moz-appearance:none; 
    appearance:none; 

} 

希望這將工作

Answer 2

如果你不想使用圖片，你可以創建一個CSS插入符這樣。 https://css-tricks.com/snippets/css/css-triangle/

要將它添加到原始選擇插入符號的位置，您必須將它們都放在相對位置標籤上併爲箭頭設置絕對位置。