Bootstrap 仅在 Rails 中部分起作用——字形图标不起作用答案

【问题标题】：Bootstrap only partially functional in rails -- glyphicons not workingBootstrap 仅在 Rails 中部分起作用——字形图标不起作用
【发布时间】：2016-04-20 14:40:51
【问题描述】：

我无法让我的字形图标在我的 Rails 资产管道中工作。

在stylesheets/application.sass，我有...

@import "bootstrap-sprockets"
@import "bootstrap"
@import "glyphicons"

我正在使用 bootstrap-sass 和 sass-rails 宝石

在stylesheets/glyphicons.css，我有...

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

这很奇怪，因为这个（下）工作正常，给了我红色的危险按钮......

<a class="detete btn btn-danger" href="#">x</a>

...虽然这个（如下）不起作用，但没有给我灰色的默认按钮或星形图标...

<a class="btn" href="#"><i class="icon-star-empty"></i></a>

这就是为什么我说 Bootstrap 只为我“部分”工作。对此的任何帮助将不胜感激。

【问题讨论】：

标签： ruby-on-rails twitter-bootstrap glyphicons

【解决方案1】：

您是否在 application.js 中添加了以下行。您在这里没有提到任何关于您的 application.js 的内容。希望对你有帮助

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

您可以查看以下链接 https://github.com/twbs/bootstrap-sass

【讨论】：

我真的去过那些。谢谢。

【解决方案2】：

默认情况下，Glyphicons 字体目录设置为字体文件夹。相反，您应该使用 asset_path 定义它。所以尝试在app/assets/stylesheets/application.css.scs中添加以下代码。

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

您可能还需要更改config/application.rb 文件。

config.assets.paths << "#{Rails}/vendor/assets/fonts"

【讨论】：

我做了您推荐的这些更改和添加，但它仍然不起作用。另外，我不明白为什么灰色的btn 也不会出现，而红色的btn btn-danger 会出现。看起来很奇怪。这让我觉得我没有完整的引导程序包，但如果我使用的是bootstrap-sass gem，我应该这样做。很奇怪。谢谢。