背景画像をCSSで設定する

Question

私のウェブページにレンダリングされているitem8というイメージがあります。これは、画像のパス上のハッシュは、画像だけでアイテム-8と命名されたとしてそこから来た私はわからないcss.sassファイル

.body-detail-intro { 
    background: url(/assets/item8-45411322696feaa47a0345b3e4bdd5de1b2cff8243c534b84a83a8d4d732ec0d.png) no-repeat; 
    background-size: cover; 
    background-position: center; 

    height: 55vh; 
    position: center; 
    color: white; 
    } 

です。ハッシュを削除してitem-8を使用すると、画像はまだロードされます。

は今Suitsandtables_HowitWorks.png

次のコードは、私も、私はまだ

を動作しませんでしたチーム-1と呼ばれる自分のサイト上で既に持っている別の画像でそれを試してみましたSuitsandtables_HowitWorks.pngでは動作しません、この画像を入力してください

.middle .right{ 
     background: image-url("/assets/team-1.jpg") no-repeat; 
     background-size: cover; 
     background-position: center; 
     height: 600px; 
     width: 300px; 
    } 

Iveはbackground、background-image、url、image-urlは何も動作していません。間違ったクラスの中で私が現在チェックしているCSSの問題かもしれませんが、私はそう考えていません。

私はあなたが使用しているので、あなたのサーバーやCDN生産にデフォルトで実行されるrake assets:precompileから来たハッシュcss.sass

Answer 1

を、使用していますが、それをキャッシュすることができます。

スプロケットはあなたのためにそのハッシュをカバーします。

私のファイル拡張子は.scssだけですが、それは問題ではありません。

.your-class { 
    // Note i'm using only the image name. No path 
    background-image: image-url('my_image.jpg'); 
} 

私は作業中のプロジェクトからこのサンプルを抜き出したので、うまくいくはずです。