我知道一些CSS和HTML的基础知识，有时与他们合作，但不是一个专业，我很好奇Bootstrap Glyphicons如何工作。我的意思是在Bootstrap zip文件中没有图像，所以图像从哪里来？
解决方法
在Bootstrap 2.x中，Glyphicons使用图像方法 – 使用您在问题中提到的图像。
图像方法的缺点是：
>您无法更改图标的颜色
>您无法更改图标的背景颜色
>您无法增加图标的大小
所以，在Bootstrap 2.x中，不是字形，很多人使用Font-awesome，因为这使用的SVG图标没有这样的限制。
在Bootstrap 3.x中，Glyphicons使用字体方法。
使用字体表示图标具有优于使用图像的优点：
>可扩展 – 无论客户端设备的分辨率如何，工作得很好
>可以改变CSS的颜色
>可以做一切传统的图标(例如改变不透明度，旋转等)
>可以添加笔画，渐变，阴影等。
>转换为文本(使用连字)
>屏幕阅读器读取连字
>将图标更改为字体就像在CSS中更改font-family一样简单
所以在Bootstrap分发中，可以看到glyphicon字体文件：
fonts\glyphicons-halflings-regular.eot fonts\glyphicons-halflings-regular.svg fonts\glyphicons-halflings-regular.ttf fonts\glyphicons-halflings-regular.woff
Bootstrap CSS指的是glyphicon字体，如下所示：
@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');
}
CSS使用.glyphicon基类链接到这个字体(注意font-family)：
.glyphicon {
position: relative;
top: 1px;
display: inline-block;
font-family: 'Glyphicons Halflings';
font-style: normal;
font-weight: normal;
...
}
然后每个glyphicon使用一个单独的图标类，引用Glyphicon Halflings字体中的Unicode reference，例如：
.glyphicon-envelope:before {
content: "\2709";
}
这就是为什么你必须在Bootstrap 3中使用基本.glyphicon类以及单个图标类与span元素：
<span class="glyphicon glyphicon-envelope"></span>