使用 css 设置 javafx TitledPane 标题的样式

Question

我试图通过使用 css 来改变 TitledPane 上标题的外观，我指定的所有样式都已应用，除了文本的颜色。

谁能看出我做错了什么？

.titled-pane > .title
{
    -fx-background-color: rgba(0, 60, 136, 0.5);
    -fx-border-color: rgba(0, 60, 136, 0.8);
    -fx-font-family: 'Lucida Grande',Verdana,Geneva,Lucida,Arial,Helvetica,sans-serif;
    -fx-font-size: 16px;
    -fx-font-weight: bold;
    -fx-text-fill: WHITE;
}

我也试过了

.titled-pane > .title > .text
{
    -fx-text-fill: WHITE;
}

没有成功

Answer 1

尽管 documentation 声称 .text 节点是 Labeled，但它实际上是 com.sun.javafx.scene.control.LabeledText，是 Text 的子类。

一个Text没有-fx-text-fill属性，但是有一个-fx-fill属性（因为它是Shape的子类） .因此，正确的 CSS 是

.titled-pane > .title
{
    -fx-background-color: rgba(0, 60, 136, 0.5);
    -fx-border-color: rgba(0, 60, 136, 0.8);
    -fx-font-family: 'Lucida Grande',Verdana,Geneva,Lucida,Arial,Helvetica,sans-serif;
    -fx-font-size: 16px;
    -fx-font-weight: bold;
}


.titled-pane > .title > .text
{
    -fx-fill: WHITE;
}

Scenic View 对解决这些问题非常有用。

使用 css 设置 javafx TitledPane 标题的样式

Style the title of a javafx TitledPane with css

css

javafx-8