css 不从绝对路径中选取图像

Question

我的目录结构是

MyPhoto
MyPhoto/css/myPhoto.css
MyPhoto/images/fatherday1.jpg

在css中，我定义了下面的类

.jumbotron-welcome {
    background-image: url('../images/fathersday1.jpg');
    background-size: cover;
    color:white;
}

我注意到
url('../images/fathersday1.jpg'); 有效，但
url('/images/fathersday1.jpg' ); 没有。

/images/.. 路径应该有效吗？我想 MyPhoto 目录是我元素的根目录，它有 images 文件夹。

Answer 1

我会试着解释一下:

../ 意思是“从你现在所在的地方往上走一个目录”。您当前的工作目录是 css。您继续前进，然后输入 images。这是一个合法的路径。

当您使用 / 启动您的资源时，您是从文档根目录开始的。您可能会看到 / 为 http://example.com/。因此，您位于文档根目录并尝试输入 images。但那是不存在的。您首先必须进入 myPhoto:url('/myPhoto/images/fathersday1.jpg');

请注意，这是基于简单的服务器设置。如果您使用更复杂的解析器，实际需要的路径可能会有所不同，但逻辑仍然存在。找出路径 / 真正开始的地方。