我认为您的特定问题不是如何使用Glyphicons，而是了解Bootstrap文件如何协同工作。

Bootstrap 需要 特定的文件结构才能工作。我从您的代码中看到了：

<link href="bootstrap.css" rel="stylesheet" media="screen">

您的Bootstrap.css是从与页面相同的位置加载的，如果您不调整文件结构，则会造成问题。

但首先，让我建议您像这样设置文件夹结构：

/css      <-- Bootstrap.css here
/fonts    <-- Bootstrap fonts here
/img
/js       <-- Bootstrap JavaScript here
index.html

如果您注意到，这也是Bootstrap在其下载ZIP中构造其文件的方式。

然后，按如下所示包含您的Bootstrap文件：

<link href="css/bootstrap.css" rel="stylesheet" media="screen">
or
<link href="./css/bootstrap.css" rel="stylesheet" media="screen">
or
<link href="/css/bootstrap.css" rel="stylesheet" media="screen">

取决于您的服务器结构或要使用的功能。

第一个和第二个相对于文件的当前目录。第二个更加明确，首先说“这里”（./），然后说css文件夹（/ css）。

如果您正在运行Web服务器，那么第三种方法很好，并且您可以只使用相对于根符号的格式，因为前导“ /”将始终从根文件夹开始。

那么，为什么呢？

Bootstrap.css具有Glyphfonts的以下特定行：

@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');
}

您会看到，Glyphfonts是通过以下方式加载的：转到一个目录../，然后查找一个名为的文件夹/fonts， 然后 加载字体文件。

URL地址相对于CSS文件的位置。因此，如果您的CSS文件位于以下相同位置：

/fonts
Bootstrap.css
index.html

CSS文件比寻找/fonts文件夹要深入一层。

因此，假设这些文件的实际位置是：

C:\www\fonts
C:\www\Boostrap.css
C:\www\index.html

从技术上讲，CSS文件将在以下位置寻找文件夹：

C:\fonts

但您的文件夹实际上位于：

C:\www\fonts

因此，看看是否有帮助。您无需执行任何“特殊”操作即可加载Bootstrap Glyphicons，只需确保适当设置了文件夹结构即可。

解决该问题后，您的HTML应该只是：

<span class="glyphicon glyphicon-comment"></span>

注意，您需要 两个 类。第一类glyphicon设置基本样式，同时glyphicon-comment设置特定图像。