bootstrap图标的概念是什么

本篇内容主要讲解"bootstrap图标的概念是什么"，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习"bootstrap图标的概念是什么"吧!

bootstrap图标是什么？

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';  -webkit-font-smoothing: antialiased;  font-style: normal;  font-weight: normal;  line-height: 1;  -moz-osx-font-smoothing: grayscale;}

到此，相信大家对"bootstrap图标的概念是什么"有了更深的了解，不妨来实际操作一番吧！这里是网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！