选择选项中的字体真棒图标

您可以简单地将FontAwesome图标添加为所选下拉菜单作为文本。您只需要CSS中的一些东西，FontAwesome CSS和unipre。例如



select {  font-family: 'FontAwesome', 'Second Font name'}

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" rel="stylesheet"/><select>  <option>Hi, &#xf042;</option>  <option>Hi, &#xf043;</option>  <option>Hi, &#xf044;</option>  <option>Hi, &#xf045;</option>  <option>Hi, &#xf046;</option></select>

单击图标可找到unipre：Fontawesome

更新：从Github问题开始，将multiple属性添加到selectelement使其适用于：

OSX El Capitan 10.11.4

• Chrome版本50.0.2661.75（64位）
• Sarafi 9.1版
• Firefox 45.0.2版

select{  font-family: FontAwesome, sans-serif;}

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" rel="stylesheet"/><select multiple>  <option>&#xf26e 500px</option>  <option>&#xf042 Adjust</option>  <option>&#xf170 Adn</option>  <option>&#xf037 Align-center</option>  <option>&#xf039 Align-justify</option>  <option>&#xf036 Align-left</option>  <option>&#xf038 Align-right</option></select>