Java 8 JavaFX - How to set the color of the title text of a single tab

Question

I have my UI layed out in an .fxml file, then I have a .css I use for defining the styles and a JavaFX Controller that extends AnchorPane.

In general it is not hard to style something, but the titles of Tabs are not explicitly defined in the .fxml and I seem to be unable to style it. I want to set the color of a single Tab to red.

Here are the approaches I have tried:

1- Setting the style directly in the .fxml:

    <Tab fx:id="tabRed" text="Tab 2" style="-fx-text-fill: red;">
        <content>
            <AnchorPane minHeight="0" minWidth="0" prefHeight="100" prefWidth="100"/>
        </content>
    </Tab>

2- Setting the style in the Controller

// an attribute of my Controller class
@FXML public Tab tabRed;

// inside the constructor of said Controller
tabRed.setStyle("-fx-text-fill: red;");

Note that I must use these versions of Java/JavaFX for reasons I do not control.

Answer 1

Use a CSS file and link the file to your FXML layout. You can check this answer How to add a CSS stylesheet in FXML.

In the CSS, you can add the following to style the label colour:

.tab .tab-label {
-fx-text-fill: red;
}

Answer 2

The way I found that works is the following: In my .fxml

<Tab fx:id="tabRed" text="Tab 2" styleClass="red-tab">
    <content>
        <AnchorPane minHeight="0" minWidth="0" prefHeight="100" prefWidth="100"/>
    </content>
</Tab>

In my .css

.red-tab .tab-label{
   -fx-text-fill: red;
}