如何通过 css 更改 JavaFX ComboBox 箭头按钮中的背景颜色？

Question

我正在尝试更改 ComboBox 中箭头按钮的背景颜色。使用 JavaFX 8 和默认 Modena.css 主题（如果重要）。

根据文档 (https://docs.oracle.com/javase/8/javafx/api/javafx/scene/doc-files/cssref.html#combobox)，箭头按钮是一个 StackPane，所以我假设以下内容会起作用：

.combo-box .arrow-button {
    -fx-background-color: blue;
}

这应该将背景更改为蓝色，但颜色仍然保持不变。

背景可能是一张图片，所以我尝试在上面添加-fx-background-image: null;，但这似乎不起作用。

不确定现在是什么问题。

更新：发现问题！

显然这是我的 css 代码有以下问题：

#arrow-button {
    -fx-padding: 5 0 5 0;
    -fx-font: 16 arial;
    -fx-font-weight: bold;
    -fx-background-color: 
        linear-gradient(#FFE4D1 0%, #EED5C2 25%, #EDD2BD 75%, #FFE4D1 100%),
        linear-gradient(#FFE1CC 0%, #FCE2CF 20%, #EDD0BB 80%, #FFE1CC 100%);
    -fx-border-color: #ED9D9C;
    -fx-background-radius: 5;
    -fx-border-radius: 5;
}

显然 JavaFX 正在使用我的 ID 选择器并使用它来显示 .combo-box .arrow-button。

这可能是一个错误，但不确定。将询问 JavaFX 开发人员。

感谢大家的帮助！

Answer 1

你可以试试这个：

.combo-box .arrow, .combo-box .arrow-button, .combo-box .arrow-button .arrow {
    -fx-background-color: blue;
}

.combo-box-base .arrow, .combo-box-base .arrow-button, .combo-box-base .arrow-button .arrow {
    -fx-background-color: blue;
}

其中一个应该可以工作。