добавить фон в 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

Это потому, что url() в CSS должно быть относительно того, где оно используется. Рассмотрим этот случай.

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

В style.css вам необходимо установить:

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

While, если вы настраиваете его на элементе с помощью JavaScript, вы настраиваете его на HTML-файл, в котором изменения URL, с в отношении HTML-файла, где CSS анализируется. Так из HTML-файла, это (img) ребенка братьев и сестер (badge.png):

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

Но в файле CSS, то есть (img) ребенок его родителя (../) братьев и сестер (badge.png). Это достаточно ясно?