jquery - 给div添加背景

Question

我想给一个div添加背景。

使用此 CSS 会按预期工作:

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

. . .但是当我使用这个 CSS 而不是上面的 CSS 时，它不起作用。

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

有什么可能出错的建议吗？

Answer 1

这是因为，CSS 中的url() 应该是相对于它被使用的地方。让我们考虑这种情况。

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

在style.css中你需要设置:

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

同时，如果您使用 JavaScript 在元素上设置它，那么您是在 HTML 文件上设置它，URL 相对于解析 CSS 的 HTML 文件发生变化。所以从 HTML 文件来看，它是 sibling (img) 的 child (badge.png):

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

但在 CSS 文件中，它是其父级 (../) 兄弟级 (img) 的子级 (badge.png)。够清楚了吧？