1.Bootstrap的字体图标
字体图标是web项目中使用的图标字体。
2.@font-face的意义和使用（如何引用这些字体图标）
@font-face使得设计师可以把自定义的字体显示在网页上，而不用担心用户的主机上没有这个字体而无法显示。
通过@font-face方法，可以把自定义的字体从服务器或者字体来源处下载到用户主机上。
以下代码来自于：点击这里
1 @font-face { 2 font-family: DeliciousRoman; 3 src: url('http://www.font-face.com/fonts/delicious/Delicious-Roman.otf'); //字体的外部来源 4 }
1 p { 2 font-family: DeliciousRoman, Helvetica, Arial, sans-serif; //这样就可以引用字体 3 }
或者你的字体就在你的服务器上
1 @font-face { 2 font-family: DeliciousRoman; 3 src: url('…/Delicious-Roman.otf'); 4 }
3.使用字体图标的方法
1 <!DOCTYPE html><html><head> 2 <title>Bootstrap 实例 - 如何使用字体图标</title> 3 <link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet"> 4 <script src="/scripts/jquery.min.js"></script> 5 <script src="/bootstrap/js/bootstrap.min.js"></script></head><body><p> 6 <button type="button" class="btn btn-default"> 7 <span class="glyphicon glyphicon-sort-by-attributes"></span> 8 </button> 9 <button type="button" class="btn btn-default"> 10 <span class="glyphicon glyphicon-sort-by-attributes-alt"></span> 11 </button> 12 <button type="button" class="btn btn-default"> 13 <span class="glyphicon glyphicon-sort-by-order"></span> 14 </button> 15 <button type="button" class="btn btn-default"> 16 <span class="glyphicon glyphicon-sort-by-order-alt"></span> 17 </button></p><button type="button" class="btn btn-default btn-lg"> 18 <span class="glyphicon glyphicon-user"></span> User</button><button type="button" class="btn btn-default btn-sm"> 19 <span class="glyphicon glyphicon-user"></span> User</button><button type="button" class="btn btn-default btn-xs"> 20 <span class="glyphicon glyphicon-user"></span> User</button></body></html>
PS：关于字体图标无法显示的问题：
网上众说纷纭，有大神说是因为平常引用bootstrap.min.css的时候是引用的部分，没有把fonts文件夹下的字体关联进去，但具体的解决方法我尝试了没有成功。我的解决方法是采用cdn提供的bootstrap.min.css。比如：我引用的是百度cdn下的：
http://apps.bdimg.com/libs/bootstrap/3.3.4/css/bootstrap.min.css
这样图标就可以正常显示了。
4.定制自己的字体
如果对引用的字体不满意，我们可以在它的基础上修改的style属性来获得自己想要的字体