html - 某些图像在 `background-image:url()` 中不起作用

Question

一些图像在 background-image:url() 中不工作，我不知道我是否需要删除 ( 和 )来自图像名称或其他任何问题？

我们将不胜感激。

这是一个工作和不工作的例子。

<!-- Not Working -->

<div style="background-image:url(https://ignite.galify.com/images/tx9gyzjfb24712-(1).jpg)"> img </div>


<!-- Working -->

<div style="background-image:url(https://ignite.galify.com/images/9mspqz9gqb1561725209327568845756.jpg)"> img1 </div>

Answer 1

转义 URL 中的特殊字符(( 和 ) 前面的 \)。

<!-- Use CSS escape character to escape special characters -->

<div style="background-image:url(https://ignite.galify.com/images/tx9gyzjfb24712-\(1\).jpg)"> img </div>


<!-- Working -->

<div style="background-image:url(https://ignite.galify.com/images/9mspqz9gqb1561725209327568845756.jpg)"> img1 </div>

或者，使用单引号 (') 将图片 URL 括起来:

<!-- Use single quote (') to enclose image URL -->

<div style="background-image:url('https://ignite.galify.com/images/tx9gyzjfb24712-(1).jpg')"> img </div>
<!-- Working-->

<div style="background-image:url(https://ignite.galify.com/images/9mspqz9gqb1561725209327568845756.jpg)"> img1
</div>