Bootstrap提供了总共263种字体图标 可以满足大部分的图标需求
为了能够正常使用bootstrap.min.css文件的上一级目录必须要有 fonts 目录,并且里面有,不能够缺失
1.字体图标
2.字体图标设置颜色
3.字体图标上加超链
4.在button上使用字体图标
<!DOCTYPE html>
<script src="js/jquery/2.0.0/jquery.min.js"></script>
<link href="css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet">
<script src="js/bootstrap/3.3.6/bootstrap.min.js"></script>
<span class="glyphicon glyphicon-share-alt"></span>
<span class="glyphicon glyphicon-share-alt text-success"></span>
<a href="#">
<span class="glyphicon glyphicon-share-alt"></span>转发
</a>
<button class="btn btn-primary btn-xs">
<span class="glyphicon glyphicon-heart"></span>点赞
</button>
<button class="btn btn-primary btn">
<span class="glyphicon glyphicon-heart"></span>点赞
</button>
</body>
</html>
5.所有的字体图标
class | 图标 | |
---|---|---|
glyphicon glyphicon-asterisk | 菊花 | |
glyphicon glyphicon-plus | 加号 | |
glyphicon glyphicon-euro | 欧元 | |
glyphicon glyphicon-eur | 欧元 | |
glyphicon glyphicon-minus | 减号 | |
glyphicon glyphicon-cloud | 云 | |
glyphicon glyphicon-envelope | 信封 | |
glyphicon glyphicon-pencil | 铅笔 | |
glyphicon glyphicon-glass | 酒杯 | |
glyphicon glyphicon-music | 音乐 | |
glyphicon glyphicon-search | 搜索 | |
glyphicon glyphicon-heart | 心型 | |
glyphicon glyphicon-star | 明星 | |
glyphicon glyphicon-star-empty | 星空 | |
glyphicon glyphicon-user | 用户 | |
glyphicon glyphicon-film | 电影 | |
glyphicon glyphicon-th-large | 粗颗粒 | |
glyphicon glyphicon-th | 细颗粒 | |
glyphicon glyphicon-th-list | 列表 | |
glyphicon glyphicon-ok | 成功 | |
glyphicon glyphicon-remove | 删除 | |
glyphicon glyphicon-zoom-in | 放大 | |
glyphicon glyphicon-zoom-out | 缩小 | |
glyphicon glyphicon-off | 关闭 | |
glyphicon glyphicon-signal | 信号 | |
glyphicon glyphicon-cog | 设置 | |
glyphicon glyphicon-trash | 垃圾箱 | |
glyphicon glyphicon-home | 主页 | |
glyphicon glyphicon-file | 文件 | |
glyphicon glyphicon-time | 时间 | |
glyphicon glyphicon-road | 道路 | |
glyphicon glyphicon-download-alt | 下载 | |
glyphicon glyphicon-download | 下载 | |
glyphicon glyphicon-upload | 上传 | |
glyphicon glyphicon-inbox | 收件箱 | |
glyphicon glyphicon-play-circle | 播放 | |
glyphicon glyphicon-repeat | 重复 | |
glyphicon glyphicon- |