4

这是相当尴尬的。我正在学习新事物，但我很惊讶我自己无法解决这个问题。

在我的桌面上，我有一个名为 Testindex.html的文件夹，其中还有一个名为 CSS 的文件夹，其中包含index.css另一个名为 images 的文件夹，其中包含一个名为logo.png.

在我的index.css文件中，我有以下行：

background: url("images/logo.png") no-repeat;

使用上面的行我无法在本地显示图像。我尝试使用/images，test/images但它不起作用。如果我在本地查看它，如何显示它？

4

4 回答 4

5

正如您所提到的，您的根文件夹中有不同的 CSS 和图像文件夹Test。由于您background在 CSS 文件中编写代码：

情况1： 

background:url("logo.png");

CSS将在文件夹内搜索您的图像。

案例2： 

background:url("images/logo.png");

将images首先在 CSS 文件夹内搜索文件夹，然后logo.png在该images文件夹内搜索。（但您的 CSS 文件夹中没有 images 文件夹）。

案例3：

background: url("../images/logo.png") no-repeat;


在这种情况下..，将带您回到主目录（即从css文件夹到您的根目录Test。然后/images将带您进入images文件夹，它会找到/logo.png您的图像的路径。）

于 2013-10-06T02:08:41.393 回答
1

将 img 更改为您的班级名称。使用内容而不是背景或背景图像，并设置一些宽度。

img {
     content: url("../img/Wizard-of-os-black.png");
     width: 90px;
}
于 2015-09-29T18:03:17.020 回答
0

尝试将其更改为

background-image: url("images/logo.png") no-repeat;
于 2013-10-06T02:11:17.570 回答
0

基本上，您必须进行逻辑思考。如果您在一个文件夹中包含一个 CSS 文件，则在该文件夹中搜索该文件中的所有链接。如果要链接到站点根目录中名为 /img 的文件夹中的图像，则必须使用

../img/pic.extension
于 2013-10-06T02:15:35.477 回答