时间戳

首页 > 解决方案 > 链接返回 404 的图像，但资产的直接链接加载正常

javascript - 链接返回 404 的图像，但资产的直接链接加载正常

问题描述

在我正在构建的网页中，一些图像返回 404 错误，但图像的直接链接可以很好地加载它们。相同的文件路径。图像的权限是 755，所以这应该不是问题。

我在 inline css 中链接到它们，我将修复它，但就像这样：

<div class="swiper-slide" style="background-image: url(t.jpg;" data-year="2012">

并且图像https://irfandesign.com/t.jpg加载正常。该网站的实时版本可以在https://irfandesign.com/dev.html找到

任何想法为什么图像没有加载？也就是说，绝对 url 取消链接这些相对 url。

标签： javascripthtmlcsshttp-status-code-404

解决方案

您只是遇到了一个非常小（但非常混乱）的语法错误。您的浏览器试图通过关闭您忘记的内容来修复它，但它最终会寻找名为t.jpg;.

记住url()是一个 CSS 的函数，所以：

selector {
   background: url('..............');
/*  if you open --^                ^---- you must close        */
}

您的style属性具有以下值：

background-image: url(t.jpg;
/* it opens ---------^     ^---- but never closes... */

因此，您的智能（但不是那么多）浏览器会尝试为您关闭它，导致它最终成为：

background-image: url(t.jpg;);
/*                          ^---- your browser trying to close it */

以下是您的房产的外观：

body { /* <-- Use your own selector */
  background-image: url('https://irfandesign.com/t.jpg');
  background-size: cover;
}

忽略 background-size 属性，它只是为了可视化。

推荐阅读