Bootstrap 字体图标

Bootstrap提供了部分字体图标供免费使用

如何使用？

1.字体图标可视作文字，可以设置font-size，color等属性

2.只对内容为空的元素起作用，图标类只能应用在不包含任何文本内容或子元素的元素上。

3.图标类不能和其他组件一起使用，应该用span来嵌套，否则尺寸会有问题

<form action="" class="form-inline">
       <div class="input-group">
           <div class="input-group-addon">
                 <span class="glyphicon glyphicon-music "></span>
            </div>
            <input type="text" class="form-control">
       </div>
</form>

正常效果：

不嵌套span使用：

<form action="" class="form-inline">
      <div class="input-group">
           <div class="input-group-addon glyphicon glyphicon-music "></div>
           <input type="text" class="form-control">
        </div>
</form>

效果：发现position的top变为1px