Rails不顯示背景圖片

Question

我有自定義的CSS文件style.css中，而不是在application.css：

background-image: url('book.png'); 

我做

rake assets:precompile RAILS_ENV=production 

，但它並不顯示圖像。我還給了圖像權限（755）。我該如何解決它？

並且在控制檯中沒有錯誤

日誌/ production.log

I, [2014-12-24T01:22:04.323979 #27157] INFO -- : Started GET "/login" for 81.21.82.67 at 2014-12-24 01:22:04 -0500 
I, [2014-12-24T01:22:04.329702 #27157] INFO -- : Processing by BookController#login as HTML 
I, [2014-12-24T01:22:04.333589 #27157] INFO -- : Rendered book/login.html.erb within layouts/application (1.0ms) 
I, [2014-12-24T01:22:04.334700 #27157] INFO -- : Completed 200 OK in 5ms (Views: 2.9ms | ActiveRecord: 0.0ms) 

當我從瀏覽器http://example.com/assets/book.jpg打開它不開，太

Answer 1

假設book.png是本地圖片，您可能需要做兩處更改：

a。將style.css更改爲style.css.scss

b。將background-image: url('book.png');替換爲background-image: image-url('book.png');

這可確保CSS使用book.png圖片的完整資產URL。

Answer 2

預編譯的圖像路徑將被更改，因此您需要使用asset_path從資產獲取正確的圖像路徑。

如果您使用asset_path，那麼預編譯後將很容易獲得圖像。

使用此：

background-image: asset_path('book.png'); 

代替：

background-image: url('book.png'); 

Answer 3

Guides are your friends。

問題是資產流水線中的資產是已重命名爲以包含反映其內容的校驗和。問題在於，到實際圖像的鏈接與您期望的不同。僅在生產環境中，資產僅針對生產環境進行預編譯。在開發過程中，沒有任何問題，因爲任何更改後資產都會在原地進行重新編譯，並提供最小化可能緩存的參數。

這是爲了更大的利益。這樣做的結果是，如果文件在新版本中發生更改，則它在服務時會得到不同的名稱（即使您自己沒有重命名），因此瀏覽器和緩存系統會立即檢測到更改並請求新資產。緩存無效無痛苦。

再培訓局的資產預編譯過程中使用，並且可以通過添加.erb到文件的名稱，如login.css.erb使用它。有an example in the guides。

.class { 
    background-image: url(<%= asset_path 'image.png' %>) 
} 

的導遊甚至形容的base64嵌入圖像直接進入CSS的方法。它適用於小圖像連接PNG圖標，少一個請求，圖像大小隻有+ 33％。

#logo { 
    background: url(<%= asset_data_uri 'logo.png' %>) 
}