无法将 img 与背景图像一起使用：url()

Question

I am having trouble to display my image in background of my html.

 <div class="item active" style="background-image:URL("/img/abc-1.jpg");"></div>

Why the url cant display my img instead, in the inspection I have done in google chrome, it shows out:

<div class="item active" style="background-image:URL(img abc-1.jpg);"></div>

Thanks

Answer 1

I think you made a mistakes. I think you are referring to w3schools .

The correct way to do it is: <div class="item active" style="background-image:URL('/img/abc-1.jpg');"></div>

without the double quotation mark

Answer 2

将双引号改为单引号：

<div class="item active" style="background-image:URL('/img/abc-1.jpg');"></div>

Answer 3

You Need to use single quotes '' like this: style="background-image:url('/img/abc-1.jpg')

This way you escape the "" double quotes used on the style property.

Answer 4

If you need the double quotes, use escape sequence. This won't close the style attribute.

<div class="item active" style="background-image:URL(\"img abc-1.jpg\");"></div>

Answer 5

Background Url should be written within single Quotes, you have used double quotes because of which style tag technically closes at style="background-image:URL("

Try using single quotes style="background-image:URL('/img/abc-1.jpg');"