bootstrap中有没有icon图标

bootstrap中有icon图标；icon图标是在web项目中使用的图标字体，bootstrap中捆绑了200多种字体格式的icon图标，并且可以通过基于项目的bootstrap来免费使用，其实现原理就是通过“@font-face属性加载了字体。

如何快速入门VUE3.0：进入学习

本教程操作环境：Windows10系统、bootstrap5版、DELL G3电脑

bootstrap中有icon图标

字体图标是在 Web 项目中使用的图标字体。虽然，Glyphicons Halflings 需要商业许可，但是您可以通过基于项目的 Bootstrap 来免费使用这些图标。

Bootstrap 捆绑了 200 多种字体格式的字形

小图标icon是一个优秀Web中不可缺少的一部分，起到画龙点睛的效果。在Bootstrap框架中也为大家提供了250多个不同的icon图片。

Bootstrap框架中的图标都是字体图标，其实现原理就是通过@font-face属性加载了字体

@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.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg'); }

　　自定义完字体之后，需要对icon设置一个默认样式，在Bootstrap框架中是通过给元素添加“glyphicon”类名来实现，然后通过伪元素“:before”的“content”属性调取对应的icon编码

.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: "2a"; }

Bootstrap部分图标如图所示：