爲div添加背景

Question

我想爲背景添加div。

使用這個CSS按預期工作：

background: url('../images/badge2.png') ; 

。 。 。但是當我使用這個CSS而不是上面的時候，它不起作用。

$('#offerDiv').css("background", "url('../images/badge2.png')"); 

有什麼建議可能會出錯？

Answer 1

另一種方法是避免應用純粹的CSS規則，只處理JavaScript代碼中的類。您可以創建一個CSS類，如：

.styledDiv { 
    background: url('../images/badge2.png'); 
} 

然後使用jQuery addClass功能，這個CSS類適用於一個元素：

$('#offerDiv').addClass("styledDiv"); 

Answer 2

這是因爲，CSS中的url()應該相對於它的使用位置。我們來考慮一下這種情況。

- index.html 
- css/ 
    - style.css 
- img 
    - badge.png 

在style.css需要設置：

background: url("../img/badge.png"); 

同時，如果您在元素上使用JavaScript設置它，你的HTML文件，其中的URL更改其設置，以尊重解析CSS的HTML文件。因此，從HTML文件，它的兄弟姐妹的（img）子（badge.png）：

background: url("img/badge.png"); 

但是在CSS文件中，這是它的母公司（../）兄弟姐妹的（img）子（badge.png）。這足夠清楚了嗎？