ruby-on-rails - Glyphicons不会在开发环境中出现在Rails 4.2和Bootstrap 3.3.3中

当我用适当的代码加载主页时，我看不到字形图标。

<button type="button" class="btn btn-default" aria-label="Left Align">
  <span class="glyphicon glyphicon-align-left" aria-hidden="true"></span>
</button>
<button type="button" class="btn btn-default btn-lg">
  <span class="glyphicon glyphicon-envelope" aria-hidden="true"></span> Star
</button>
<i class="glyphicon glyphicon-search"></i>
<a href="#"><span class="glyphicon glyphicon-star"></span> Star</a>

我在/app/assets/fonts/bootstrap中有字体。

在 applications.js 文件中:

//= require bootstrap-sprockets
//= require bootstrap

在 application.css.scss 文件中:

@import "bootstrap-sprockets";
@import "bootstrap";

在 Gemfile的文件中:

gem 'bootstrap-sass', '~> 3.3.3'
gem 'sprockets-rails'
gem 'sass-rails', '~> 5.0'

在 _glyphicons.scss 文件中:

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url(if($bootstrap-sass-asset-helper, twbs-font-path('#{$icon-font-path}#{$icon-font-name}.eot'), '#{$icon-font-path}#{$icon-font-name}.eot'));
  src: url(if($bootstrap-sass-asset-helper, twbs-font-path('#{$icon-font-path}#{$icon-font-name}.eot?#iefix'), '#{$icon-font-path}#{$icon-font-name}.eot?#iefix')) format('embedded-opentype'),
       url(if($bootstrap-sass-asset-helper, twbs-font-path('#{$icon-font-path}#{$icon-font-name}.woff2'), '#{$icon-font-path}#{$icon-font-name}.woff2')) format('woff2'),
       url(if($bootstrap-sass-asset-helper, twbs-font-path('#{$icon-font-path}#{$icon-font-name}.woff'), '#{$icon-font-path}#{$icon-font-name}.woff')) format('woff'),
       url(if($bootstrap-sass-asset-helper, twbs-font-path('#{$icon-font-path}#{$icon-font-name}.ttf'), '#{$icon-font-path}#{$icon-font-name}.ttf')) format('truetype'),
       url(if($bootstrap-sass-asset-helper, twbs-font-path('#{$icon-font-path}#{$icon-font-name}.svg##{$icon-font-svg-id}'), '#{$icon-font-path}#{$icon-font-name}.svg##{$icon-font-svg-id}')) format('svg');
}

在 _variables.scss 文件中:

$icon-font-path: if($bootstrap-sass-asset-helper, "bootstrap/", "../fonts/bootstrap/") !default;

//** File name for all font files.
$icon-font-name:          "glyphicons-halflings-regular" !default;
//** Element ID within SVG icon file.
$icon-font-svg-id:        "glyphicons_halflingsregular" !default;

最佳答案

好吧...我不确定您是否解决了问题。但是我之前也遇到过同样的问题，它不是基于代码的，您的代码看起来应该可以正常工作。

问题可能出在您的浏览器安全设置上。例如，如果您使用的是 Internet Explorer ，则它可能处于某种安全状态，该限制了字体的下载，而Glyphicons被视为字体。

因此，请转到“Internet选项”菜单的“安全性”选项卡，然后启用字体下载。

不幸的是，总是有少数人启用了这样的安全设置，并且永远不会看到Glyphicons，因此，应该始终将它们与纯文本一起使用，而不是独立使用。

关于ruby-on-rails - Glyphicons不会在开发环境中出现在Rails 4.2和Bootstrap 3.3.3中，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/28475187/