添加fontawsome图标以选择

时间:2018-11-19 10:01:03

标签: html font-awesome

我想在我的选择字段中添加fontawsome图标,因为我知道不可能以常规方式这样做,但是您需要添加unicode图标。我试过的女巫。寻找提示或指针。

<div class="form-group">    
    <label for="grade">Sätt betyg på ölen</label>
    <select class="form-control" name="grade">
        <option value="1">&#xf005; 1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>          
    </select>
</div>

我尝试了您的解决方案,但没有任何效果,我还尝试将URL更改为fontawsome的最新版本,例如

@import url("https://use.fontawesome.com/releases/v5.5.0/css/all.css");
select { font-family: 'FontAwesome', Verdana }

<div class="form-group">    
    <label for="grade">Sätt betyg på ölen</label>
    <select class="form-control" name="rating">
        <option value="1">&#xf005; 1</option>
        <option value="2">&#xf005; 2</option>
        <option value="3">&#xf005; 3</option>
        <option value="4">&#xf005; 4</option>
        <option value="5">&#xf005; 5</option>          
    </select>
</div>

1 个答案:

答案 0 :(得分:1)

@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css");
select { font-family: 'FontAwesome', Verdana }
<div class="form-group">    
    <label for="grade">Sätt betyg på ölen</label>
    <select class="form-control" name="grade">
        <option value="1" >1 &#xf042</option>
        <option value="2">2 &#xf043</option>

    </select>
</div>

单击图标http://fontawesome.io/icons

可以找到unicode。