字形在一种环境中呈现为空框,但在另一种环境中呈现为空框

Glyphicons rendering as empty box in one environment, but not the other

我在 SO 上阅读了很多关于这个问题的话题。但是 none 涵盖了我的情况。我的 bootstrap 字形仅在生产中显示为垂直矩形。它们在开发和登台服务器上显示良好。

完全相同的文件副本。

这是我对相关字形的 HTML(剃刀视图):

<button class="btn btn-default" id="btn-cancel"><span class="glyphicon glyphicon-arrow-left" aria-hidden="true"></span> Cancel</button>

Web 服务器在暂存和生产中都是 IIS7。

实际上在 IE11 中,glyicons 根本不显示。查看图片以了解它在 Chrome 和 FireFox 中的样子:

确保包含 5 个文件的字体文件夹位于基础 public 文件夹中。

glyphicon 显示为正方形,因为它无法加载字体。确保对字体文件夹没有限制。这些是我能想到的可能有助于修复它的原因:

  • 您的部署服务器上缺少字体文件夹。修复:检查你的 bootstrap/web 文件并确保你复制了所有内容,并且字体文件夹中存在字体。

字体文件夹放错了。字体文件夹始终是 bootstrap.css 文件上方的一个文件夹。确保你的字体和包含你的 css 的文件夹是这样的:

 bootstrap/
 ├── css/
 │   ├── bootstrap.css
 ├── js/
 │   └── bootstrap.min.js
 └── fonts/
    |__ glyphicons-halflings-regular.eot

调试:检查您的浏览器控制台是否有任何"fail to load resources"错误

  • 如果您仍然无法理解,请稍后检查文件。肯定是某处缺少文件或无法加载文件。
  • IE 在字体方面有一些限制:check more here

http://forums.iis.net/t/1179660.aspx 提供的答案解决了这个问题。我将它粘贴在下面以防万一 link 中断:

...[C]heck if IUSR have (sic) access to the website. Please take the following steps:

  1. Open IIS Manager, expand sites node and select your site.
  2. Click "Edit Permissions.." in the right actions pane.
  3. Switch to security tab, add IUSR for read permission if the permission is not granted for the user.

You can check the following article for more information about the built-in accounts in IIS7:

Understanding Built-In User and Group Accounts in IIS 7 http://learn.iis.net/page.aspx/140/understanding-built-in-user-and-group-accounts-in-iis-7/

我遇到了同样的问题,发现一旦我将它链接到 html 头,它就可以正常工作。我希望这也能为您解决。 <link rel="stylesheet"href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">