Twitter bootstrap - Glyphicons

Question

我正在使用亚马逊s3。

我的字形图标没有出现。

我在我的头脑中添加了以下内容

<style>
[class^="icon-"],
[class*=" icon-"] {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-top: 1px;
  *margin-right: .3em;
  line-height: 14px;
  vertical-align: text-top;
  background-image: url("https://s3.amazonaws.com/BUCKET/img/glyphicons-halflings.png");
  background-position: 14px 14px;
  background-repeat: no-repeat;
}

</style>

我认为它会覆盖旧的路径，但我仍然看不到字形图标。

有什么想法吗？

Answer 1

我也有同样的问题--我已经把范围缩小到使用生产CDN而不是测试的.css。

在heroku上，我将RAILS_ENV和RACK_ENV设置为测试，但是它仍然使用生产CDN编译CSS。

其他资产显示正确的CDN，由于以下原因，似乎使用了Prod CDN：

@iconSpritePath: asset-path('twitter/bootstrap/glyphicons-halflings.png');

Answer 2

每个sprite都有一个它所在的background-position，您可以使用该样式覆盖所有这些样式。由于您只想更改sprites的源，因此可以使用：

[class^="icon-"],
[class*=" icon-"] {
    background-image: url("https://s3.amazonaws.com/BUCKET/img/glyphicons-halflings.png");
}