带有引导程序 3.3.4 的字形图标在 rails 4.2.1 中不起作用

Question

我有使用 bootstrap 3.3.x 和 glyphicons 的 rails 4.2.1 应用程序。我不能使用 boostrap-sass 或任何其他 gem 来集成 bootstrap 和 rails，因为原来的 bootstrap.css 已经被设计师修改了。我还有一个 custom.css 文件。

我已将所有 css 文件（应用程序、引导程序和自定义）重命名为使用 scss 格式。目前，引导 css 工作正常，但未显示字形图标。我已将 bootstrap.scss 中的字体代码替换为

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url(font-path('glyphicons-halflings-regular.eot'));
  src: url(font-path('glyphicons-halflings-regular.eot?#iefix')) format('embedded-opentype');
  src: url(font-path('glyphicons-halflings-regular.woff2')) format('woff2');
  src: url(font-path('glyphicons-halflings-regular.woff')) format('woff');
  src: url(font-path('glyphicons-halflings-regular.ttf')) format('truetype');
  src: url(font-path('glyphicons-halflings-regular.svg#glyphicons_halflingsregular')) format('svg');
}

以前（fontawesome + rails 4.0.1 not working），我确实将 rails 中的 scss 文件配置为使用不同的字体，并且确实有效。我在当前的 rails 应用程序中尝试了相同的方法，但无法弄清楚它失败的原因。这里(https://github.com/prasadsurase/rails-fonts.git) 是一个用于检查问题的示例 Rails 应用程序。

感谢您的任何建议。

Answer 1

您的 SCSS 有错误。 @font-face 应声明如下：

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url(font-path('glyphicons-halflings-regular.eot'));
  src: url(font-path('glyphicons-halflings-regular.eot?#iefix')) format('embedded-opentype'),
       url(font-path('glyphicons-halflings-regular.woff2')) format('woff2'),
       url(font-path('glyphicons-halflings-regular.woff')) format('woff'),
       url(font-path('glyphicons-halflings-regular.ttf')) format('truetype'),
       url(font-path('glyphicons-halflings-regular.svg#glyphicons_halflingsregular')) format('svg');
}

请注意，恰好有 2 个src 规范。第一个src 有一个url()，第二个src 有多个url() 声明，用逗号分隔，而不是分号。