2016-08-28 38 views
0

我試圖將圖標添加到選擇組的末尾。我有abs定位僞元素,但我無法看到它。添加圖標以選擇下拉菜單

標記:

<select id="signup-sector" name="signup-sector" class="signup-select"> 
         <option value="sector">Sector</option> 
         <option value="volvo">Volvo</option> 
         <option value="saab">Saab</option> 
         <option value="mercedes">Mercedes</option> 
        </select> 

CSS:

select.signup-select::after { 
    content: "\f107;"; 
    position: absolute; 
    top: 5px; 
    right: 5px; 
    font-size: 20px; 
    color: black; 
} 

。選擇具有位置相對集。

感謝

回答

1

這裏是我做的,試試這個.. 希望這可以幫助你......

.signup-select:after { 
 
    content: ""; 
 
    position: absolute; 
 
    right: 10px; 
 
    top: 3px; 
 
    width: 0; 
 
    height: 0; 
 
    border-left: 10px solid transparent; 
 
    border-right: 10px solid transparent; 
 
    border-top: 10px solid #333; 
 
}
<select id="signup-sector" name="signup-sector" class="signup-select"> 
 
         <option value="sector">Sector</option> 
 
         <option value="volvo">Volvo</option> 
 
         <option value="saab">Saab</option> 
 
         <option value="mercedes">Mercedes</option> 
 
        </select>