为Html的select option元素添加图案

在Html中，select的<option>some text</option>标签中是不能加任何子标签的，比如span、img等等，那么是不是就只能是纯文字呢？

经过一段时间的研究，其实还是可以用font-awesome、glyphicons等等的图标来美化一下我们的option的，方法如下：

@font-face {
    font-family: glyphicons;
    font-size: small;
    src: url("../fonts/fontawesome-webfont.woff") format("woff");//字体路径
}

body {
    font-family: glyphicons, "Microsoft YaHei UI";
}

用FontCreator软件，或者查看此类字体的css文件，找到某个字符的名称，如“F046”

那么我们就可以在option中写<option>&#xF046</option> 就可以显示这个字符啦！（&#x就是符号）