使用css更改javafx微调按钮的样式

Question

我正在尝试使用css样式表更改javafx微调器的样式。

但是，在更改颜色时，我只能更改文本字段的颜色，而旋转器侧面的箭头按钮仍然看起来像默认颜色。

如何更改这些按钮的颜色？

Answer 1

设置用作按钮背景的-fx-body-color：

.spinner .increment-arrow-button,
.spinner .decrement-arrow-button {
    -fx-body-color: yellow;
}

.spinner .increment-arrow-button:hover,
.spinner .decrement-arrow-button:hover {
    /* interpolate color between yellow and red based on first color brightness */
    -fx-body-color: ladder(#444, yellow 0%, red 100%);
}

.spinner .increment-arrow-button:hover:pressed,
.spinner .decrement-arrow-button:hover:pressed,
.spinner .increment-arrow-button:pressed,
.spinner .decrement-arrow-button:pressed {
    /* interpolate color between yellow and red based on first color brightness */
    -fx-body-color: ladder(#AAA, yellow 0%, red 100%);
}

默认样式表将它们用作按钮的背景颜色。