Question

我正在尝试使用fontawesome图标字体更改html选择菜单的图标。我的代码如下

<select>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
</select>

我的css是

select {
    position: relative;
}
 select:after {
    font-family: 'FontAwesome';
    content: '\F150';
    position: absolute;
    color: black;
}

这是 demo

我该怎么做？有人可以帮帮我..

Answer 1

它与浏览器呈现选择的方式有关。

您需要为select添加标签，然后将css放在标签

之后

<select id="select-1" name="select-1"> ... </select> <label for="select-1"></label>

然后在css

#select-1 + label:after { styling }

http://jsfiddle.net/YdQka/9/

造型html选择菜单

1 个答案: