2

我正在使用亚马逊 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>

我以为它会覆盖旧路径，但我仍然看不到字形。

有任何想法吗？

4

2 回答 2

6

每个精灵都有一个background-position它所在的位置，并且您正在使用该样式覆盖它们。由于您只想更改精灵的来源，请使用：

[class^="icon-"],
[class*=" icon-"] {
    background-image: url("https://s3.amazonaws.com/BUCKET/img/glyphicons-halflings.png");
}
于 2012-09-07T07:26:41.163 回答
4

我有同样的问题 - 并将其范围缩小到.css使用生产 CDN 而不是 TEST。

在 heroku 上，我已经准备RAILS_ENV好RACK_ENV进行测试，但它仍然使用生产 CDN 编译 CSS。

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

@iconSpritePath: asset-path('twitter/bootstrap/glyphicons-halflings.png');
于 2012-10-21T06:29:09.057 回答