css - 如何在 CSS 中引用锚窗格？

Question

是否有可能在 CSS 中引用锚窗格？

如果锚窗格恰好是根，那就没关系：

.root{
-fx-background-image: url("xxx.yy");
}

有用。但如果没有，那该怎么做呢？我试过 .anchor-pane{}，它没有用。然后我读到，那个锚窗格拥有窗格所拥有的一切。所以我也尝试了 .pane{} ......它没有用。

如何将背景设置为无根锚窗格？谢谢！

Answer 1

您始终可以分配 acss class并将其显式添加到 AnchorPane

anchorPane.getStyleClass().add("pane");

在你的 CSS 中：

.pane{
    -fx-background-image: url("xxx.yy");
}

---

您可以通过添加一个来执行相同的操作css id

anchorPane.setId("pane");

在你的 css 中：

#pane{
    -fx-background-image: url("xxx.yy");
}

Answer 2

这个答案和Itachi的一样，我只是同时写的。。

---

您在 CSS 样式表中使用CSS 选择器来选择节点。

窗格是一个节点。一个节点可以有一个 css id 集node.setId("xyzzy-id")，也可以有样式类集node.getStyleClass().add("xyzzy-class")。

对于提供的示例，您可以通过以下任一方式选择窗格：

按 ID 选择：

#xyzzy-id {
    -fx-background-color: palegreen;
}

按类别选择：

.xyzzy-class {
    -fx-background-color: papayawhip;
}

您还可以在节点上为 id 和样式类设置 FXML 属性（而不是像上面解释的那样在代码中执行此操作）。SceneBuilder 有这方面的字段，因此如果您使用 SceneBuilder 编写 FXML，只需填写适当的字段，它就会将所需的属性添加到您的 FXML 文件中。