css - 来自硬盘的 css 图像

Question

我即将构建一个 GUI，我正在尝试通过 css 将图像加载为背景图像。我的 HTML 工作表几乎是空的，除了标题和我加载 GUI 的 div 容器，它是用 JAVA 和 Google Web Toolkit 构建的。

从互联网加载背景图像效果很好！

.Bild {
    background: url("http://developer.aldebaran-robotics.com/media/img/home/nao_h25.png")
    no-repeat
    center;
}

但是现在我想从我的硬盘加载它，最好从项目中的文件夹中加载。结构如下所示：

工作区→项目→战争→css文件

工作区→项目→图像→image.png

我通过使用相对路径进行了尝试。我不确定我是否做得正确。它不起作用：

.Bild {
    background: url(/images/image.png)
    no-repeat
    center;
}

我相信你能帮助我！

非常感谢

score 2 · Accepted Answer

您需要提供图像文件相对于 css 文件的路径让我们以您的目录结构为例：

workspace/
 project/
   war/
      cssfile.css
   images/
      image.png

您相对于 css 文件的图像路径必须是

../images/image.png

.Bild {
    background: url(../images/image.png)
    no-repeat
    center;
}

这里：..表示当前目录之上的一个目录。您可以使用../../向上两个目录。

要找出相对路径，您需要向上导航到公共父目录，然后向下走到媒体文件的位置。在这种情况下，公共父目录是上一级的，因此../就足够了，然后向下走目录结构images/image.png。

score 0 · Accepted Answer

语法没有错。所以问题一定出在路径上。通过以斜杠开头的网址/，

/images/image.png

意味着绝对位置

http://some-host-name/images/image.png

那是你的形象吗？

2 回答 2