1. Bootstrap 解析
  2. 第十三讲：字体图标

Bootstrap 解析 第十二讲：Glyphicon（字体图标）

Bootstrap 字体图标

图标类不能和其它组件直接联合使用。它们不能在同一个元素上与其他类共同存在。应该创建一个嵌套的 <span> 标签，并将图标类应用到这个 <span> 标签上。

字体图标库

Demo

.glyphicon .glyphicon-* 图标字体使用

					
<span class="glyphicon glyphicon-home"></span>

.glyphicon .glyphicon-* 按钮中添加图标字体（注意：图标和文本之间需要添加一个空格）

					
<button type="button" class="btn btn-default"><span class="glyphicon glyphicon-home"></span> default 按钮</button>
<button type="button" class="btn btn-primary"><span class="glyphicon glyphicon-home"></span> primary 按钮</button>
<button type="button" class="btn btn-success"><span class="glyphicon glyphicon-home"></span> success 按钮</button>
<button type="button" class="btn btn-info"><span class="glyphicon glyphicon-home"></span> info 按钮</button>
<button type="button" class="btn btn-warning"><span class="glyphicon glyphicon-home"></span> warning 按钮</button>
<button type="button" class="btn btn-danger"><span class="glyphicon glyphicon-home"></span> danger 按钮</button>
<button type="button" class="btn btn-link"><span class="glyphicon glyphicon-home"></span> link 按钮</button>