在CSS中设置JavaFX的根样式

Question

我希望能够通过CSS文件最初地应用多种样式（字体，字号）到我的组件中。
（我正在使用Oracle的SceneBuilder 2.0。）
因此，我将我的CSS文件添加到了顶级组件中。

我的CSS文件如下所示：
Application.css

.root {
    -fx-font: 14px Arial;
}

.button {
    -fx-font: 28px Arial;
}

我的Application.fxml文件如下：

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.text.*?>
<?import javafx.scene.control.*?>
<?import java.lang.*?>
<?import javafx.scene.layout.*?>


<VBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="240.0" prefWidth="320.0" stylesheets="@Application.css" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <Text strokeType="OUTSIDE" strokeWidth="0.0" text="MyText" />
      <Label text="MyLabel" />
      <Button mnemonicParsing="false" text="MyButton" />
   </children>
</VBox>

现在我将一个文本元素或标签元素添加到我的窗格中，字体不会受根节点的影响。但是如果我向该窗格中添加一个按钮元素，则应用 .button 的样式。
我期望 .root 节点会影响任何其他元素的样式，就像这个已回答的问题中所示，但它没有起作用： 在 JavaFX 中全局设置字体
有人可以解释一下我做错了什么吗？

唯一实现类似效果的方法是：直接设置样式，如下：

-fx-font: 14px Arial;

在 Style 下，我希望能够将其存储在CSS文件中。

- KnusperPudding

---

尝试将root样式类显式添加到您的根元素中，即 <VBox styleClass="root" maxHeight="-Infinity" ...>。我知道当您向场景添加样式表时，场景的根自动获得.root样式类，但我不知道当您将样式表添加到父元素时是否也是如此。 - James_D

@James_D 那确实可以工作，但我不认为这是它应该工作的方式。对于按钮，它可以在不设置样式类的情况下工作。虽然我担心如果我的某个场景真的需要一个可能用于根元素的样式类，我可能会遇到问题。 - KnusperPudding

默认情况下，Button具有button样式类。 VBox没有默认样式类。 如果您认为可能将其嵌入具有不同根的场景中，则应为VBox选择除root以外的样式类。 - James_D

VBox只是一个例子。我实际上想使用一个全局的CSS文件，可以应用于任何根FXML文件。主项目是一个存储为FXML的splitpane，在分割窗格的右侧，我添加了一些具有不同根的嵌入式场景。因此，我希望设置一个“全局”CSS，可以应用于它们中的任何一个。因此，.root部分看起来非常棒，我希望我只是犯了一个错误，希望有人可以纠正我。但是.root对于任何元素都有效，对吗？ - KnusperPudding

Answer 1

我删除了之前的回答。它不准确，并且有点混淆。

容器控件没有-fx-font属性。因此，当您定义：

.root {
    -fx-font: 14px Arial;
}

它完全没有影响。

如果你想设置所有子控件的字体，应该这样做：

.root * {
    -fx-font: 14px Arial;
}

或者，如果您想仅更改容器中的特定控件：

.table-view .label {
    -fx-font: 14px Arial;
}

或者应用程序的所有标签：

.label {
    -fx-font: 14px Arial;
}

- Oliver Voutat