1. ホーム
  2. ruby-on-rails

[解決済み】Rails: Rails4内のCSSで画像を参照する方法

2022-04-10 02:44:38

質問

Heroku上のRails 4で奇妙な問題があります。 画像をコンパイルするときにハッシュが追加されるのですが、CSS内からそれらのファイルを参照するときに、適切な名前に調整されないのです。 つまり、以下のようなことです。 私はlogo.pngというファイルを持っています。しかし、herokuに表示されたとき、それは次のように表示されます。

/assets/logo-200a00a193ed5e297bb09ddd96afb953.png

しかし、CSSにはまだ記載があります。

background-image:url("./logo.png");

結果:画像が表示されない。 どなたか、この現象に遭遇された方はいらっしゃいますか? どうすれば解決できますか?

解決方法は?

Sassと組み合わせたSprocketsは いくつかの便利なヘルパー を使用することができます。Sprocketsは のみ これらのヘルパーは、スタイルシートのファイル拡張子が .css.scss または .css.sass .


画像専用ヘルパーです。

background-image: image-url("logo.png")


アグノスティックヘルパーです。

background-image: asset-url("logo.png", image)
background-image: asset-url($asset, $asset-type)


あるいは、cssファイルに画像データを埋め込む場合。

background-image: asset-data-url("logo.png")