如何在CSS中设置JavaFX SplitMenuButton的样式

Question

我尝试在JavaFX中设置SplitMenuButton的样式。我的fxml文件中有一个menuButton和一个SplitMenuButton。

我的CSS-File看起来像这样：

.menu-button {
    -fx-background-color: red;
    }

.split-menu-button .label {
    -fx-background-color: green;
    }

.split-menu-button .arrow {
    -fx-background-color: yellow;
    }

但我无法弄清楚如何为SplitMenuButton的箭头周围区域设计样式。我尝试了几种方法，但没有任何效果

.split-menu-button .menu-button {
    -fx-background-color: blue;
    }

.split-menu-button .menu-button .label {
    -fx-background-color: blue;
    }

.split-menu-button .menu{
    -fx-background-color: blue;
    }

.split-menu-button .menu-item {
    -fx-background-color: blue;
    }

.split-menu-button .button {
    -fx-background-color: blue;
    }

.split-menu-button .menu-bar {
    -fx-background-color: blue;
    }

Answer 1

有两种有用的技巧可用于确定复杂组件的各个部分的样式类，如下所示：

1. 从jfxrt.jar文件中提取默认样式表modena.css，看看如何定义默认样式（您也可以在线查找modena.css）
2. 使用ScenicView检查应用程序在运行时

在这种情况下，我使用了ScenicView;你需要的CSS是

.split-menu-button .arrow-button {
    -fx-background-color: yellow ;
}