bootrap3是支持的图标 ,4不支持

4已经移除了 收费图标,取而代之建议使用其他的,比如 https://octicons.github.com/ 和http://fontawesome.io/ 但是3和4我都用过的,直接扣下了3里面的部分。

如图目录结构:

您可以将一下代码copy到您引入的bootstrap-4.0.0-dist/css/bootstrap.css 文件中

注意:(注意:如下代码依赖glyphicons-.eot、glyphicons-.ttf、glyphicons-*.svg 文件)

@font-face {

font-family: 'Glyphicons Halflings';

src: url('../fonts/glyphicons-halflings-regular.eot');

src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');

}

.glyphicon {

position: relative;

top: 1px;

display: inline-block;

font-family: 'Glyphicons Halflings';

font-style: normal;

font-weight: normal;

line-height: 1;

-webkit-font-smoothing: antialiased;

-moz-osx-font-smoothing: grayscale;

}

.glyphicon-asterisk:before {

content: "\002a";

}

.glyphicon-plus:before {

content: "\002b";

}

.glyphicon-euro:before,

.glyphicon-eur:before {

content: "\20ac";

}

.glyphicon-minus:before {

content: "\2212";

}

.glyphicon-cloud:before {

content: "\2601";

}

.glyphicon-envelope:before {

content: "\2709";

}

.glyphicon-pencil:before {

content: "\270f";

}

.glyphicon-glass:before {

content: "\e001";

}

.glyphicon-music:before {

content: "\e002";

}

.glyphicon-search:before {

content: "\e003";

}

.glyphicon-heart:before {

content: "\e005";

}

.glyphicon-star:before {

content: "\e006";

}

.glyphicon-star-empty:before {

content: "\e007";

}

.glyphicon-user:before {

content: "\e008";

}

.glyphicon-film:before {

content: "\e009";

}

.glyphicon-th-large:before {

content: "\e010";

}

.glyphicon-th:before {

content: "\e011";

}

.glyphicon-th-list:before {

content: "\e012";

}

.glyphicon-ok:before {

content: "\e013";

}

.glyphicon-remove:before {

content: "\e014";

}

.glyphicon-zoom-in:before {

content: "\e015";

}

.glyphicon-zoom-out:before {

content: "\e016";

}

.glyphicon-off:before {

content: "\e017";

}

.glyphicon-signal:before {

content: "\e018";

}

.glyphicon-cog:before {

content: "\e019";

}

.glyphicon-trash:before {

content: "\e020";

}

.glyphicon-home:before {

content: "\e021";

}

.glyphicon-file:before {

content: "\e022";

}

.glyphicon-time:before {

content: "\e023";

}

.glyphicon-road:before {

content: "\e024";

}

.glyphicon-download-alt:before {

content: "\e025";

}

.glyphicon-download:before {

content: "\e026";

}

.glyphicon-upload:before {

content: "\e027";

}

.glyphicon-inbox:before {

content: "\e028";

}

.glyphicon-play-circle:before {

content: "\e029";

}

.glyphicon-repeat:before {

content: "\e030";

}

.glyphicon-refresh:before {

content: "\e031";

}

.glyphicon-list-alt:before {

content: "\e032";

}

.glyphicon-lock:before {

content: "\e033";

}

.glyphicon-flag:before {

content: "\e034";

}

.glyphicon-headphones:before {

content: "\e035";

}

.glyphicon-volume-off:before {

content: "\e036";

}

.glyphicon-volume-down:before {

content: "\e037";

}

.glyphicon-volume-up:before {

content: "\e038";

}

.glyphicon-qrcode:before {

content: "\e039";

}

.glyphicon-barcode:before {

content: "\e040";

}

.glyphicon-tag:before {

content: "\e041";

}

.glyphicon-tags:before {

content: "\e042";

}

.glyphicon-book:before {

content: "\e043";

}

.glyphicon-bookmark:before {

content: "\e044";

}

.glyphicon-print:before {

content: "\e045";

}

.glyphicon-camera:before {

content: "\e046";

}

.glyphicon-font:before {

content: "\e047";

}

.glyphicon-bold:before {

content: "\e048";

}

.glyphicon-italic:before {

content: "\e049";

}

.glyphicon-text-height:before {

content: "\e050";

}

.glyphicon-text-width:before {

content: "\e051";

}

.glyphicon-align-left:before {

content: "\e052";

}

.glyphicon-align-center:before {

content: "\e053";

}

.glyphicon-align-right:before {

content: "\e054";

}

.glyphicon-align-justify:before {

content: "\e055";

}

.glyphicon-list:before {

content: "\e056";

}

.glyphicon-indent-left:before {

content: "\e057";

}

.glyphicon-indent-right:before {

content: "\e058";

}

.glyphicon-facetime-video:before {

content: "\e059";

}

.glyphicon-picture:before {

content: "\e060";

}

.glyphicon-map-marker:before {

content: "\e062";

}

.glyphicon-adjust:before {

content: "\e063";

}

.glyphicon-tint:before {

content: "\e064";

}

.glyphicon-edit:before {

content: "\e065";

}

.glyphicon-share:before {

content: "\e066";

}

.glyphicon-check:before {

content: "\e067";

}

.glyphicon-move:before {

content: "\e068";

}

.glyphicon-step-backward:before {

content: "\e069";

}

.glyphicon-fast-backward:before {

content: "\e070";

}

.glyphicon-backward:before {

content: "\e071";

}

.glyphicon-play:before {

content: "\e072";

}

.glyphicon-pause:before {

content: "\e073";

}

.glyphicon-stop:before {

content: "\e074";

}

.glyphicon-forward:before {

content: "\e075";

}

.glyphicon-fast-forward:before {

content: "\e076";

}

.glyphicon-step-forward:before {

content: "\e077";

}

.glyphicon-eject:before {

content: "\e078";

}

.glyphicon-chevron-left:before {

content: "\e079";

}

.glyphicon-chevron-right:before {

content: "\e080";

}

.glyphicon-plus-sign:before {

content: "\e081";

}

.glyphicon-minus-sign:before {

content: "\e082";

}

.glyphicon-remove-sign:before {

content: "\e083";

}

.glyphicon-ok-sign:before {

content: "\e084";

}

.glyphicon-question-sign:before {

content: "\e085";

}

.glyphicon-info-sign:before {

content: "\e086";

}

.glyphicon-screenshot:before {

content: "\e087";

}

.glyphicon-remove-circle:before {

content: "\e088";

}

.glyphicon-ok-circle:before {

content: "\e089";

}

.glyphicon-ban-circle:before {

content: "\e090";

}

.glyphicon-arrow-left:before {

content: "\e091";

}

.glyphicon-arrow-right:before {

content: "\e092";

}

.glyphicon-arrow-up:before {

content: "\e093";

}

.glyphicon-arrow-down:before {

content: "\e094";

}

.glyphicon-share-alt:before {

content: "\e095";

}

.glyphicon-resize-full:before {

content: "\e096";

}

.glyphicon-resize-small:before {

content: "\e097";

}

.glyphicon-exclamation-sign:before {

content: "\e101";

}

.glyphicon-gift:before {

content: "\e102";

}

.glyphicon-leaf:before {

content: "\e103";

}

.glyphicon-fire:before {

content: "\e104";

}

.glyphicon-eye-open:before {

content: "\e105";

}

.glyphicon-eye-close:before {

content: "\e106";

}

.glyphicon-warning-sign:before {

content: "\e107";

}

.glyphicon-plane:before {

content: "\e108";

}

.glyphicon-calendar:before {

content: "\e109";

}

.glyphicon-random:before {

content: "\e110";

}

.glyphicon-comment:before {

content: "\e111";

}

.glyphicon-magnet:before {

content: "\e112";

}

.glyphicon-chevron-up:before {

content: "\e113";

}

.glyphicon-chevron-down:before {

content: "\e114";

}

.glyphicon-retweet:before {

content: "\e115";

}

.glyphicon-shopping-cart:before {

content: "\e116";

}

.glyphicon-folder-close:before {

content: "\e117";

}

.glyphicon-folder-open:before {

content: "\e118";

}

.glyphicon-resize-vertical:before {

content: "\e119";

}

.glyphicon-resize-horizontal:before {

content: "\e120";

}

.glyphicon-hdd:before {

content: "\e121";

}

.glyphicon-bullhorn:before {

content: "\e122";

}

.glyphicon-bell:before {

content: "\e123";

}

.glyphicon-certificate:before {

content: "\e124";

}

.glyphicon-thumbs-up:before {

content: "\e125";

}

.glyphicon-thumbs-down:before {

content: "\e126";

}

.glyphicon-hand-right:before {

content: "\e127";

}

.glyphicon-hand-left:before {

content: "\e128";

}

.glyphicon-hand-up:before {

content: "\e129";

}

.glyphicon-hand-down:before {

content: "\e130";

}

.glyphicon-circle-arrow-right:before {

content: "\e131";

}

.glyphicon-circle-arrow-left:before {

content: "\e132";

}

.glyphicon-circle-arrow-up:before {

content: "\e133";

}

.glyphicon-circle-arrow-down:before {

content: "\e134";

}

.glyphicon-globe:before {

content: "\e135";

}

.glyphicon-wrench:before {

content: "\e136";

}

.glyphicon-tasks:before {

content: "\e137";

}

.glyphicon-filter:before {

content: "\e138";

}

.glyphicon-briefcase:before {

content: "\e139";

}

.glyphicon-fullscreen:before {

content: "\e140";

}

.glyphicon-dashboard:before {

content: "\e141";

}

.glyphicon-paperclip:before {

content: "\e142";

}

.glyphicon-heart-empty:before {

content: "\e143";

}

.glyphicon-link:before {

content: "\e144";

}

.glyphicon-phone:before {

content: "\e145";

}

.glyphicon-pushpin:before {

content: "\e146";

}

.glyphicon-usd:before {

content: "\e148";

}

.glyphicon-gbp:before {

content: "\e149";

}

.glyphicon-sort:before {

content: "\e150";

}

.glyphicon-sort-by-alphabet:before {

content: "\e151";

}

.glyphicon-sort-by-alphabet-alt:before {

content: "\e152";

}

.glyphicon-sort-by-order:before {

content: "\e153";

}

.glyphicon-sort-by-order-alt:before {

content: "\e154";

}

.glyphicon-sort-by-attributes:before {

content: "\e155";

}

.glyphicon-sort-by-attributes-alt:before {

content: "\e156";

}

.glyphicon-unchecked:before {

content: "\e157";

}

.glyphicon-expand:before {

content: "\e158";

}

.glyphicon-collapse-down:before {

content: "\e159";

}

.glyphicon-collapse-up:before {

content: "\e160";

}

.glyphicon-log-in:before {

content: "\e161";

}

.glyphicon-flash:before {

content: "\e162";

}

.glyphicon-log-out:before {

content: "\e163";

}

.glyphicon-new-window:before {

content: "\e164";

}

.glyphicon-record:before {

content: "\e165";

}

.glyphicon-save:before {

content: "\e166";

}

.glyphicon-open:before {

content: "\e167";

}

.glyphicon-saved:before {

content: "\e168";

}

.glyphicon-import:before {

content: "\e169";

}

.glyphicon-export:before {

content: "\e170";

}

.glyphicon-send:before {

content: "\e171";

}

.glyphicon-floppy-disk:before {

content: "\e172";

}

.glyphicon-floppy-saved:before {

content: "\e173";

}

.glyphicon-floppy-remove:before {

content: "\e174";

}

.glyphicon-floppy-save:before {

content: "\e175";

}

.glyphicon-floppy-open:before {

content: "\e176";

}

.glyphicon-credit-card:before {

content: "\e177";

}

.glyphicon-transfer:before {

content: "\e178";

}

.glyphicon-cutlery:before {

content: "\e179";

}

.glyphicon-header:before {

content: "\e180";

}

.glyphicon-compressed:before {

content: "\e181";

}

.glyphicon-earphone:before {

content: "\e182";

}

.glyphicon-phone-alt:before {

content: "\e183";

}

.glyphicon-tower:before {

content: "\e184";

}

.glyphicon-stats:before {

content: "\e185";

}

.glyphicon-sd-video:before {

content: "\e186";

}

.glyphicon-hd-video:before {

content: "\e187";

}

.glyphicon-subtitles:before {

content: "\e188";

}

.glyphicon-sound-stereo:before {

content: "\e189";

}

.glyphicon-sound-dolby:before {

content: "\e190";

}

.glyphicon-sound-5-1:before {

content: "\e191";

}

.glyphicon-sound-6-1:before {

content: "\e192";

}

.glyphicon-sound-7-1:before {

content: "\e193";

}

.glyphicon-copyright-mark:before {

content: "\e194";

}

.glyphicon-registration-mark:before {

content: "\e195";

}

.glyphicon-cloud-download:before {

content: "\e197";

}

.glyphicon-cloud-upload:before {

content: "\e198";

}

.glyphicon-tree-conifer:before {

content: "\e199";

}

.glyphicon-tree-deciduous:before {

content: "\e200";

}

.glyphicon-cd:before {

content: "\e201";

}

.glyphicon-save-file:before {

content: "\e202";

}

.glyphicon-open-file:before {

content: "\e203";

}

.glyphicon-level-up:before {

content: "\e204";

}

.glyphicon-copy:before {

content: "\e205";

}

.glyphicon-paste:before {

content: "\e206";

}

.glyphicon-alert:before {

content: "\e209";

}

.glyphicon-equalizer:before {

content: "\e210";

}

.glyphicon-king:before {

content: "\e211";

}

.glyphicon-queen:before {

content: "\e212";

}

.glyphicon-pawn:before {

content: "\e213";

}

.glyphicon-bishop:before {

content: "\e214";

}

.glyphicon-knight:before {

content: "\e215";

}

.glyphicon-baby-formula:before {

content: "\e216";

}

.glyphicon-tent:before {

content: "\26fa";

}

.glyphicon-blackboard:before {

content: "\e218";

}

.glyphicon-bed:before {

content: "\e219";

}

.glyphicon-apple:before {

content: "\f8ff";

}

.glyphicon-erase:before {

content: "\e221";

}

.glyphicon-hourglass:before {

content: "\231b";

}

.glyphicon-lamp:before {

content: "\e223";

}

.glyphicon-duplicate:before {

content: "\e224";

}

.glyphicon-piggy-bank:before {

content: "\e225";

}

.glyphicon-scissors:before {

content: "\e226";

}

.glyphicon-bitcoin:before {

content: "\e227";

}

.glyphicon-btc:before {

content: "\e227";

}

.glyphicon-xbt:before {

content: "\e227";

}

.glyphicon-yen:before {

content: "\00a5";

}

.glyphicon-jpy:before {

content: "\00a5";

}

.glyphicon-ruble:before {

content: "\20bd";

}

.glyphicon-rub:before {

content: "\20bd";

}

.glyphicon-scale:before {

content: "\e230";

}

.glyphicon-ice-lolly:before {

content: "\e231";

}

.glyphicon-ice-lolly-tasted:before {

content: "\e232";

}

.glyphicon-education:before {

content: "\e233";

}

.glyphicon-option-horizontal:before {

content: "\e234";

}

.glyphicon-option-vertical:before {

content: "\e235";

}

.glyphicon-menu-hamburger:before {

content: "\e236";

}

.glyphicon-modal-window:before {

content: "\e237";

}

.glyphicon-oil:before {

content: "\e238";

}

.glyphicon-grain:before {

content: "\e239";

}

.glyphicon-sunglasses:before {

content: "\e240";

}

.glyphicon-text-size:before {

content: "\e241";

}

.glyphicon-text-color:before {

content: "\e242";

}

.glyphicon-text-background:before {

content: "\e243";

}

.glyphicon-object-align-top:before {

content: "\e244";

}

.glyphicon-object-align-bottom:before {

content: "\e245";

}

.glyphicon-object-align-horizontal:before {

content: "\e246";

}

.glyphicon-object-align-left:before {

content: "\e247";

}

.glyphicon-object-align-vertical:before {

content: "\e248";

}

.glyphicon-object-align-right:before {

content: "\e249";

}

.glyphicon-triangle-right:before {

content: "\e250";

}

.glyphicon-triangle-left:before {

content: "\e251";

}

.glyphicon-triangle-bottom:before {

content: "\e252";

}

.glyphicon-triangle-top:before {

content: "\e253";

}

.glyphicon-console:before {

content: "\e254";

}

.glyphicon-superscript:before {

content: "\e255";

}

.glyphicon-subscript:before {

content: "\e256";

}

.glyphicon-menu-left:before {

content: "\e257";

}

.glyphicon-menu-right:before {

content: "\e258";

}

.glyphicon-menu-down:before {

content: "\e259";

}

.glyphicon-menu-up:before {

content: "\e260";

}

*** 感谢博客园 @ 追枫博客园 指正 fonts/文件引用问题

bootstrap4.0图标使用_Bootstrap4 glyphicon 移除图标 glyphicon fonts-faces 解决方案相关推荐

  1. Bootstrap4 glyphicon 移除图标 glyphicon fonts-faces 解决方案

    Bootstrap4 glyphicon 移除图标 glyphicon fonts-faces 解决方案 参考文章: (1)Bootstrap4 glyphicon 移除图标 glyphicon fo ...

  2. Android 系统(225)---Android 7.0切换阿拉伯语,QuickSetting界面图标左右翻转

    Android 7.0切换阿拉伯语,QuickSetting界面图标左右翻转. 切换手机语言为阿拉伯语,下拉状态栏到Quicksetting界面,快捷图标左右翻转.如下图 如果不想要这个左右翻转效果, ...

  3. Android9.0解决WIFI已连接,但图标显示不能上网问题

    Android9.0解决WIFI已连接,但图标显示不能上网问题,具体修改如下:

  4. Vue 使用echarts 地图自定义图标和修改图标样式,点击切换图标

    效果图:如下 注意事项: 1.使用echarts最好看官方文档,官方文档(链接如下) https://echarts.apache.org/examples/zh/index.html#chart-t ...

  5. 桌面上的计算机图标一直被选定,常见电脑桌面图标问题十则

    (一)怎样让我的桌面图标不能随便移动? 答:在桌面上单击鼠标右键,把排列图标的自动排列前面的对钩选中,就可以随意固定自己的图标了,而不能随便移动了. (二)怎么样把桌面上的图标随便移动到另外位置? 答 ...

  6. mac提示“已损坏,无法打开。 您应该将它移到废纸篓“的终极解决方案

    文章来源:mac提示"已损坏,无法打开. 您应该将它移到废纸篓"的终极解决方案_liuxingyu的博客-CSDN博客_已损坏,无法打开. 您应该将它移到废纸篓 1.打开任何来源设 ...

  7. win7恢复计算机图标不见了怎么办,win7桌面图标找不到的五种恢复方法

    使用win7旗舰版系统的朋友无意间发现桌面什么都没有了,包括桌面的浏览器.我的电脑.我的文档.回收站等等都不见了.出现这种情况对于新用户使用win7系统真是让着急,又不知道该哪里设置,也不知道哪里出现 ...

  8. android 和风图标字体移植显示墨迹天气图标

    android studio版本:21.2.1 例程:newareaautov1 和风天气字体图标使用方法见: android 显示和风天气字体图标_kim5659的博客-CSDN博客_qweathe ...

  9. html手机点赞图标素材,微信点赞心形图标,微信点赞分享心形图标素材

    微信点赞心形图标素材,微信公众号心形图标怎么添加,如何实现心形图标效果,2017微信点赞心形图标精选推荐,教你如何实现点赞关注效果. 微信点赞心形图标: 微信点赞心形图标素材下载: 以上就是微信点赞心 ...

最新文章

  1. 搜索引擎之---Apache solr的实现
  2. python list的一个面试题
  3. 简述python中面向对象的概念_简述Python中的面向对象编程的概念
  4. MRJob 极速入门教程,使用Python玩转Hadoop
  5. 天了噜,Java 8 要停止维护了!
  6. 论文浅尝 | 基于图注意力的常识对话生成
  7. 并发量,QPS,TPS,看这一篇就够了
  8. Pycharm -- RuntimeWarning: Parent module '...' not found while handling absolute import
  9. 支付宝认错,回应央行 18 万行政罚单!
  10. 中国十个主要城市10-18年的统计年鉴
  11. pageoffice 选中部分文字 添加书签和空白处添加书签 删除空白以及内容书签
  12. mysql .pem 文件_对于https ssl中的pem文件和key 文件的理解
  13. 记2017莫名其妙的美团校招安卓岗
  14. upyun java_又拍云Java SDK
  15. 启动weblogic的遇见的一些问题及解决方案(环境为win 10 64位,weblogic 12.2.1)
  16. input设置type为number,禁止输入e等符号,去除上下箭头
  17. 抖音接口安全参数X-Ladon、X-Argus计算过程分析
  18. SpringMVC IP权限设计
  19. 设置所有JSP页面,让IE9使用兼容模式运行
  20. 行为识别 运动员辅助训练_卫生技术和辅助研究员

热门文章

  1. 损失函数 Loss 设计和实现
  2. 嵌入式编程学习笔记(一)
  3. 1032:Parliament
  4. php京东图床上传接口源码,京东图床上传api接口源码
  5. LaTeX写UESTC毕业论文遇到的问题集锦
  6. 极客头条微信公众号开通,欢迎关注
  7. 网上银行安全手段面面观
  8. Mac Pro下安装Homebrew教程来啦~
  9. 力科示波器上位机软件NS-Scope功能介绍
  10. win7注册表修改默认搜索引擎