Bootstrap提供了总共263种字体图标 可以满足大部分的图标需求
为了能够正常使用bootstrap.min.css文件的上一级目录必须要有 fonts 目录，并且里面有，不能够缺失
为了能够正常使用bootstrap.min.css文件的上一级目录必须要有 fonts 目录，并且里面有，不能够缺失
- 一个字体图标
使用class: glyphicon glyphicon-asterisk
<span class="glyphicon glyphicon-asterisk"></span>
<!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-asterisk"></span> - 字体图标设置颜色
加一个文本类 text-success
<span class="glyphicon glyphicon-asterisk text-success"></span>
<!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-asterisk text-success"></span> - 字体图标上加超链
在span外面套一个a标签
<a href="#nowhere"> <span class="glyphicon glyphicon-asterisk"></span> 连接 </a>
<!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> <a href="#nowhere"> <span class="glyphicon glyphicon-asterisk"></span> 连接 </a> - 在button上使用字体图标
在span外面套一个button标签
<button class="btn btn-primary btn"> <span class="glyphicon glyphicon-asterisk"></span> 按钮 </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> <button class="btn btn-primary btn-xs"> <span class="glyphicon glyphicon-asterisk"></span> 最小按钮 </button> <button class="btn btn-primary btn"> <span class="glyphicon glyphicon-asterisk"></span> 按钮 </button> - 所有的字体图标
预览 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-refresh 刷新 glyphicon glyphicon-list-alt 列表 glyphicon glyphicon-lock 锁定 glyphicon glyphicon-flag 旗帜 glyphicon glyphicon-headphones 耳机 glyphicon glyphicon-volume-off 静音 glyphicon glyphicon-volume-down 调低音量 glyphicon glyphicon-volume-up 调高音量 glyphicon glyphicon-qrcode 二维码 glyphicon glyphicon-barcode 条码 glyphicon glyphicon-tag 标签 glyphicon glyphicon-tags 复数标签 glyphicon glyphicon-book 书籍 glyphicon glyphicon-bookmark 书签 glyphicon glyphicon-print 打印 glyphicon glyphicon-camera 相机 glyphicon glyphicon-font 字体 glyphicon glyphicon-bold 粗体 glyphicon glyphicon-italic 斜体 glyphicon glyphicon-text-height 文本高度 glyphicon glyphicon-text-width 文本宽度 glyphicon glyphicon-align-left 左对齐 glyphicon glyphicon-align-center 居中对齐 glyphicon glyphicon-align-right 右对齐 glyphicon glyphicon-align-justify 对齐 glyphicon glyphicon-list 列表 glyphicon glyphicon-indent-left 左缩进 glyphicon glyphicon-indent-right 右缩进 glyphicon glyphicon-facetime-video 视频 glyphicon glyphicon-picture 图片 glyphicon glyphicon-map-marker 地图标记 glyphicon glyphicon-adjust 调整 glyphicon glyphicon-tint 色彩 glyphicon glyphicon-edit 编辑 glyphicon glyphicon-share 分享 glyphicon glyphicon-check 检查 glyphicon glyphicon-move 移动 glyphicon glyphicon-step-backward 单步后退 glyphicon glyphicon-fast-backward 快速后退 glyphicon glyphicon-backward 后退 glyphicon glyphicon-play 播放 glyphicon glyphicon-pause 暂停 glyphicon glyphicon-stop 停止 glyphicon glyphicon-forward 前进 glyphicon glyphicon-fast-forward 快速前进 glyphicon glyphicon-step-forward 单步向前 glyphicon glyphicon-eject 弹出 glyphicon glyphicon-chevron-left 左 glyphicon glyphicon-chevron-right 右 glyphicon glyphicon-plus-sign 增加 glyphicon glyphicon-minus-sign 减少 glyphicon glyphicon-remove-sign 删除 glyphicon glyphicon-ok-sign 确定 glyphicon glyphicon-question-sign 问题 glyphicon glyphicon-info-sign 信息 glyphicon glyphicon-screenshot 截图 glyphicon glyphicon-remove-circle 删除 glyphicon glyphicon-ok-circle 确定 glyphicon glyphicon-ban-circle 禁止 glyphicon glyphicon-arrow-left 左箭头 glyphicon glyphicon-arrow-right 右箭头 glyphicon glyphicon-arrow-up 上箭头 glyphicon glyphicon-arrow-down 下箭头 glyphicon glyphicon-share-alt 分享 glyphicon glyphicon-resize-full 打开 glyphicon glyphicon-resize-small 关闭 glyphicon glyphicon-exclamation-sign 感叹号 glyphicon glyphicon-gift 礼物 glyphicon glyphicon-leaf 树叶 glyphicon glyphicon-fire 火焰 glyphicon glyphicon-eye-open 睁眼 glyphicon glyphicon-eye-close 闭眼 glyphicon glyphicon-warning-sign 警告 glyphicon glyphicon-plane 飞机 glyphicon glyphicon-calendar 日历 glyphicon glyphicon-random 随机播放 glyphicon glyphicon-comment 评论 glyphicon glyphicon-magnet 磁铁 glyphicon glyphicon-chevron-up 上调 glyphicon glyphicon-chevron-down 下调 glyphicon glyphicon-retweet 转发 glyphicon glyphicon-shopping-cart 购物车 glyphicon glyphicon-folder-close 关闭文件夹 glyphicon glyphicon-folder-open 打开文件夹 glyphicon glyphicon-resize-vertical 垂直调整 glyphicon glyphicon-resize-horizontal 水平调整 glyphicon glyphicon-hdd 硬盘 glyphicon glyphicon-bullhorn 扩音器 glyphicon glyphicon-bell 铃铛 glyphicon glyphicon-certificate 证书 glyphicon glyphicon-thumbs-up 赞同 glyphicon glyphicon-thumbs-down 否定 glyphicon glyphicon-hand-right 右手 glyphicon glyphicon-hand-left 左手 glyphicon glyphicon-hand-up 举起手 glyphicon glyphicon-hand-down 放下手 glyphicon glyphicon-circle-arrow-right 右箭头 glyphicon glyphicon-circle-arrow-left 左箭头 glyphicon glyphicon-circle-arrow-up 上箭头 glyphicon glyphicon-circle-arrow-down 下箭头 glyphicon glyphicon-globe 全球 glyphicon glyphicon-wrench 扳手 glyphicon glyphicon-tasks 任务 glyphicon glyphicon-filter 过滤器 glyphicon glyphicon-briefcase 公文包 glyphicon glyphicon-fullscreen 全屏 glyphicon glyphicon-dashboard 仪表板 glyphicon glyphicon-paperclip 回形针 glyphicon glyphicon-heart-empty 空的心型 glyphicon glyphicon-link 链接 glyphicon glyphicon-phone 手机 glyphicon glyphicon-pushpin 图钉 glyphicon glyphicon-usd 美元 glyphicon glyphicon-gbp 英镑 glyphicon glyphicon-sort 排序 glyphicon glyphicon-sort-by-alphabet 字母正序 glyphicon glyphicon-sort-by-alphabet-alt 字母倒序 glyphicon glyphicon-sort-by-order 数字正序 glyphicon glyphicon-sort-by-order-alt 数字倒序 glyphicon glyphicon-sort-by-attributes 属性正序 glyphicon glyphicon-sort-by-attributes-alt 属性倒序 glyphicon glyphicon-unchecked 未选中 glyphicon glyphicon-expand 扩展 glyphicon glyphicon-collapse-down 向下扩展 glyphicon glyphicon-collapse-up 向上扩展 glyphicon glyphicon-log-in 登录 glyphicon glyphicon-flash 闪电 glyphicon glyphicon-log-out 注销 glyphicon glyphicon-new-window 新窗口 glyphicon glyphicon-record 记录 glyphicon glyphicon-save 已保存 glyphicon glyphicon-open 打开 glyphicon glyphicon-saved 保存的 glyphicon glyphicon-import 导入 glyphicon glyphicon-export 导出 glyphicon glyphicon-send 发送 glyphicon glyphicon-floppy-disk 软盘 glyphicon glyphicon-floppy-saved 软盘已保存 glyphicon glyphicon-floppy-remove 软盘删除 glyphicon glyphicon-floppy-save 软盘保存 glyphicon glyphicon-floppy-open 软盘打开 glyphicon glyphicon-credit-card 信用卡 glyphicon glyphicon-transfer 转移 glyphicon glyphicon-cutlery 餐具 glyphicon glyphicon-header 标题 glyphicon glyphicon-compressed 压缩 glyphicon glyphicon-earphone 听筒 glyphicon glyphicon-phone-alt 电话 glyphicon glyphicon-tower 塔 glyphicon glyphicon-stats 统计 glyphicon glyphicon-sd-video 标清视频 glyphicon glyphicon-hd-video 高清视频 glyphicon glyphicon-subtitles 字幕 glyphicon glyphicon-sound-stereo 音响音响 glyphicon glyphicon-sound-dolby 声音杜比 glyphicon glyphicon-sound-5-1 sound-5-1 glyphicon glyphicon-sound-6-1 sound-6-1 glyphicon glyphicon-sound-7-1 sound-7-1 glyphicon glyphicon-copyright-mark 版权标志 glyphicon glyphicon-registration-mark 注册商标 glyphicon glyphicon-cloud-download 云下载 glyphicon glyphicon-cloud-upload 云上传 glyphicon glyphicon-tree-conifer 针叶树 glyphicon glyphicon-tree-deciduous 落叶树 glyphicon glyphicon-cd CD glyphicon glyphicon-save-file 保存文件 glyphicon glyphicon-open-file 打开文件 glyphicon glyphicon-level-up 水平上升 glyphicon glyphicon-copy 复制 glyphicon glyphicon-paste 粘贴 glyphicon glyphicon-alert 警报 glyphicon glyphicon-equalizer 均衡器 glyphicon glyphicon-king 国王 glyphicon glyphicon-queen 女王 glyphicon glyphicon-pawn 小卒 glyphicon glyphicon-bishop 主教 glyphicon glyphicon-knight 骑士 glyphicon glyphicon-baby-formula 婴儿配方 glyphicon glyphicon-tent 帐篷 glyphicon glyphicon-blackboard 黑板 glyphicon glyphicon-bed 床 glyphicon glyphicon-apple 苹果 glyphicon glyphicon-erase 擦除 glyphicon glyphicon-hourglass 沙漏 glyphicon glyphicon-lamp 灯 glyphicon glyphicon-duplicate 复制 glyphicon glyphicon-piggy-bank 储蓄罐 glyphicon glyphicon-scissors 剪刀 glyphicon glyphicon-bitcoin 比特币 glyphicon glyphicon-btc 比特币 glyphicon glyphicon-xbt 比特币 glyphicon glyphicon-yen 日元 glyphicon glyphicon-jpy 日元 glyphicon glyphicon-ruble 卢布 glyphicon glyphicon-rub 卢布 glyphicon glyphicon-scale 仪表 glyphicon glyphicon-ice-lolly 冰棍 glyphicon glyphicon-ice-lolly-tasted 雪糕口味 glyphicon glyphicon-education 教育 glyphicon glyphicon-option-horizontal 水平 glyphicon glyphicon-option-vertical 垂直 glyphicon glyphicon-menu-hamburger 菜单 glyphicon glyphicon-modal-window 模态窗口 glyphicon glyphicon-oil 油 glyphicon glyphicon-grain 粮食 glyphicon glyphicon-sunglasses 太阳镜 glyphicon glyphicon-text-size 文本大小 glyphicon glyphicon-text-color 文本颜色 glyphicon glyphicon-text-background 文本背景 glyphicon glyphicon-object-align-top 向上对齐 glyphicon glyphicon-object-align-bottom 向下对齐 glyphicon glyphicon-object-align-horizontal 水平对齐 glyphicon glyphicon-object-align-left 左对齐 glyphicon glyphicon-object-align-vertical 垂直对齐 glyphicon glyphicon-object-align-right 右对齐 glyphicon glyphicon-triangle-right 三角右 glyphicon glyphicon-triangle-left 三角左 glyphicon glyphicon-triangle-bottom 三角下 glyphicon glyphicon-triangle-top 三角上 glyphicon glyphicon-console 控制台 glyphicon glyphicon-superscript 上标 glyphicon glyphicon-subscript 下标 glyphicon glyphicon-menu-left 左菜单 glyphicon glyphicon-menu-right 右菜单 glyphicon glyphicon-menu-down 下菜单 glyphicon glyphicon-menu-up 上菜单
5793
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
