Question

当我改变想象的路径时。浏览器不显示图像工作代码

body {
background-image: url("D:\main.jpg");
background-repeat: no-repeat;
background-position : center;
background-attachment : fixed ;
}

相同的代码，但更改图像的路径不会在浏览器中显示图像。不工作

body {
background-image: url("D:\Source_Code\HTML\Adventure Time\main.jpg");
background-repeat: no-repeat;
background-position : center;
background-attachment : fixed ;
}

Answer 1

您应该从当前的css文件中提取网址path，而不是从计算机的根目录中提取。它也是斜线而不是反斜杠。

例如，如果包含此文件的css文件位于adventure-time目录中，请执行：background-image: url("./main.jpg");

Answer 2

尝试提供虚拟路径而不是物理路径。例如 background-image：url（“/ HTML / Adventure Time / main.jpg”）;

Answer 3

大多数网址是相对的原因是因为绝对网址会起作用，尽管它们依赖于操作系统。这对于可维护性来说是不可取的。

为了解释一个相对网址（因为你的亲戚网址似乎适合你），我做了这个例子。我将使用以下文件结构。：

您的网页位于./myWebsite/Pages 你的CSS在./myWebsite/CSS中图像位于./myWebsite/Images

然后图像的网址如下：

background-image: url("./Images/main.jpg");

网址细分：

网址由不同的部分组成，非常简单。第一部分是＆＃34; ./"。这只是说＆＃34;父目录＆＃34;。

因此，这行代码所在的文件的父目录（./ myWebsite / CSS / stylesheet.css）将是＆＃34; ./ myWebsite /＆＃34;。

然后下一部分是＆＃34; Images /＆＃34;。这意味着像; ＆＃34;选择文件夹＆＃39;图像＆＃39; ＆＃34;

现在我们导航到父目录，然后选择图像所在的文件夹。剩下要做的唯一事情是选择图像，这是通过指定其名称和扩展名来完成的; ＆＃34; main.jpg＆＃34 ;.

请记住这是一个基本的解释

浏览器未显示图像

3 个答案: