Question

我正在使用以下宝石：

gem 'therubyracer', platforms: :ruby
#gem "therubyracer"
gem "less-rails" #Sprockets (what Rails 3.1 uses for its asset pipeline) supports LESS
gem "twitter-bootstrap-rails"

并且在资产管道中这是代码

*
 *= require_bootstrap_and_overrides
 *= require_self
 *= require_tree .
 */

并在bootstrap_and覆盖文件中这是代码

@import "twitter/bootstrap/bootstrap";

// Set the correct sprite paths
@iconSpritePath: image-url("twitter/bootstrap/glyphicons-halflings.png");
@iconWhiteSpritePath: image-url("twitter/bootstrap/glyphicons-halflings-white.png");

// Set the Font Awesome (Font Awesome is default. You can disable by commenting below lines)
@fontAwesomeEotPath: font-url("fontawesome-webfont.eot");
@fontAwesomeEotPath_iefix: font-url("fontawesome-webfont.eot?#iefix");
@fontAwesomeWoffPath: font-url("fontawesome-webfont.woff");
@fontAwesomeTtfPath: font-url("fontawesome-webfont.ttf");
@fontAwesomeSvgPath: font-url("fontawesome-webfont.svg#fontawesomeregular");

// Font Awesome
//@import "fontawesome/font-awesome";

// Glyphicons
@import "twitter/bootstrap/glyphicons.less";

// Your custom LESS stylesheets goes here

//
// Since bootstrap was imported above you have access to its mixins which
// you may use and inherit here
//
// If you'd like to override bootstrap's own variables, you can do so here as well
// See http://twitter.github.com/bootstrap/customize.html#variables for their names and documentation
//
// Example:
// @link-color: #ff0000;
@import url(http://fonts.googleapis.com/css?family=Capriola);

当我使用类<i class="fa fa-user"></i>时，这样的glyphicon正在显示。但对于班级<i class="glyphicon glyphicon-user"></i glyphicon没有显示正确的图像。

Answer 1

Bootstrap未正确包含在您的资产管道中，请尝试通过从CDN源导入而不是从资产文件加载来解决此问题：

将此添加到 views / layout 文件夹中 application.html.erb 文件的head部分：

FontAwesome图标：

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" />

Glyphicon图标，与bootstrap缩小的CDN一起打包：

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet">

Answer 2

我强烈建议您切换到https://github.com/twbs/bootstrap-sass并按照指南进行操作

Bootstrap 3 Glyphicons在rails中无法正确渲染

2 个答案: