使用相对路径时不显示 CSS 背景图像

Question

我正在使用 JavaFX 开发元素。文件结构如下所示(CEP 是根):

CEP
  +img
     menu.jpg
  +src
     +css_files
        MainMenu.css

我想要做的是在 MainMenu.css 文件中设置 img 目录中的背景图像。到目前为止，我已经尝试了不同的网址(见下文)，但没有一个有效。

-fx-background-image: url("./CEP/img/menu.jpg");
-fx-background-image: url("../CEP/img/menu.jpg");
-fx-background-image: url("CEP/img/menu.jpg");
-fx-background-image: url("/CEP/img/menu.jpg");
-fx-background-image: url("../../img/menu.jpg");
-fx-background-image: url("/img/menu.jpg");
-fx-background-image: url("./img/menu.jpg");
-fx-background-image: url("../img/menu.jpg");
-fx-background-image: url("img/menu.jpg");

如果我像这样使用完整路径

-fx-background-image: url("file:///C:/Users/Konrad/Desktop/java/CEP/img/menu.jpg");

一切正常，但这不是我想要做的。如何使用相对路径加载我的背景图片？

编辑。根据要求，这里是 build 文件夹结构:

build
   +classes
      +css_files
      +(other folders)
      menu.jpg
   +empty (empty)
   +generated-sources (has 1 empty subfolder)

Answer 1

您的 img 文件夹及其内容不是源文件夹层次结构的一部分，因此不会作为应用程序的一部分进行部署。您可以配置您的 IDE 以部署该文件夹的内容，或者更简单地将 img(及其内容)移动到 src 中。

如果你选择后者，那么 img 将在部署后位于类路径的根目录下，与 css_files 一起，所以

-fx-background-image: url("/img/menu.jpg");

或

-fx-background-image: url("../img/menu.jpg");

应该可以。

另一方面，如果您将img 配置为源文件夹，则img 的内容将放在类路径的根目录下。在这种情况下，这意味着 menu.jpg 将位于类路径的根目录中，因此您需要其中之一

-fx-background-image: url("/menu.jpg");

或

-fx-background-image: url("../menu.jpg");