css - 未选择选项卡的选项卡标签的不同字体颜色

Question

我尝试通过 CSS 为 Java FX 8 TabPane 组件设置样式。目前，我正在努力为选定和未选定的 tab-label 使用不同的字体颜色。最后，我希望选定的选项卡具有白色字体颜色，而不是选定的选项卡具有黑色字体颜色。不幸的是，我不知道如何引用未选中或仅引用选中的 tab-label。我尝试了 .tab-label:selected 但它没有用。我还尝试了 .tab:selected > .tab-label 但还是没有用。

下面是我到目前为止编写的 CSS 代码和 TabPane 的预览。

#tabPane {
    -fx-background-color: #FFFFFF;
}

#tabPane .tab-header-background {
    -fx-background-color: #FFFFFF;
}

#tabPane .tab {
    -fx-background-color: #d0d0d0;
    -fx-background-radius: 0;
    -fx-padding: 5 10 10 10;
}

#tabPane .tab:selected {
    -fx-background-color: #202020;
    -fx-focus-color: transparent;
}

#tabPane .tab-label {
    -fx-text-fill: #FFFFFF;
    -fx-font-size: 18px;
}

PS 提到的 TabPane 仅由上面的 CSS 代码修改。没有其他修改。因此，没有额外的代码。

Answer 1

我觉得

#tabPane .tab:selected .tab-label {
    -fx-text-fill: black ;
} 

应该可以。在 #tab-pane .tab-label 规则之后添加它可能很重要。