Question

我安装了bootstrap-sass Gem并试图使用一些字形，但它们没有以正确的方式显示。它看起来像浏览器正在使用实际glyphicons的替换，但它不会给我任何错误消息。

对于大多数glyphicons我只得到这个： ，例如铅笔，我得到✏。看起来浏览器找不到它们，但据我所知，我的样式表正在正确加载。那么我必须解决宝石中可能存在的问题吗？

我的代码如下所示：

application.css.scss

/*
 *= require jquery-ui
 *= require_tree .
 *= require_self
 */

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

的application.js

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require bootstrap-sprockets
//= require moment
//= require jquery_nested_form
//= require turbolinks
//= require ckeditor/init
//= require_tree .

index.html.erb

<%= link_to booking_path(booking), :class => 'btn btn-xs', :title => "#{ t('.show', :default => t('helpers.links.show')) }" do %>
    <%= glyph 'info-sign' %>
<%- end -%>

如果您需要更多信息，请告诉我们。

EDIT1：

我的代码创建了以下html：

<a class="btn btn-xs" title="Show" href="/houses/1">
  <span class="glyphicon glyphicon-info-sign"></span>
</a>

Answer 1

在指定了rails-sass.gem和bootstrap-sass.gem的Gem版本后，它终于可以工作了。

gem 'bootstrap-sass', '~> 3.3.5.1'
gem 'sass-rails', '~> 5.0.1'

Answer 2

在记录bootstrap-sass后，您必须remove *= require_self和*= require_tree {/ 1}}。

然后，删除所有* = require_self和* = require_tree。声明   来自sass文件。相反，使用@import导入Sass文件。

不要在Sass中使用* = require，否则您的其他样式表不会   能够访问Bootstrap mixins或变量。

所以你可以使用@import

<强> application.css.scss

application.css.scss

Rails 4中的bootstrap-sass没有显示正确的glyphicons

2 个答案: