css - 为什么外部 CSS 样式表的位置很重要？

Question

我是一名初级程序员，看过一些资源，但我不明白为什么外部 css 样式表的位置很重要。例如，分别更改文件的链接和文件的位置，将决定图片是否加载:

css 中的简单一行:

body {
    background: url(./images/test.jpg) center center fixed no-repeat;
}

这将加载图片:

<link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" />

这不会:

<link rel="stylesheet" href="css/style.css" type="text/css" charset="utf-8" />

为什么？

Answer 1

这是因为您的css 文件夹中没有images 文件夹。它是相对于 css 文件，而不是 html 文件。

你可以这样修复:

body {
    background: url(../images/test.jpg) center center fixed no-repeat;
}

这首先进入根目录，然后进入图像文件夹。

然后你可以使用你的 css 行:

<link rel="stylesheet" href="css/style.css" type="text/css" charset="utf-8" />