Working with advanced CSS syntax

In this section, we will review the following advanced options:

• Pseudo-classes
• Descendant selectors
• Referring to the resources
• Constants
• The inherit keyword

Using pseudo-classes

Pseudo-classes allow you to set different styles for different states of the JavaFX nodes.

For example, for a radio button control, you can set a different style for the selected item using the :selected pseudo-class:

/* chapter6/syntax/pseudo-class-demo.css */
.radio-button { -fx-font-size: 30 }
.radio-button:selected { -fx-text-fill: red; -fx-font-weight: bold }

Using this style sheet in the following demonstration produces a customized radio button group:

// chapter6/syntax/PseudoClassDemo.java
public void start(Stage stage) {
    VBox root = new VBox(10);
    ToggleGroup group = new ToggleGroup();
    for (String title : new String[] {"Cats", "Dogs", "Birds", "Mices"}) {
        RadioButton rb = new RadioButton(title);
        rb.setToggleGroup(group);
        root.getChildren().add(rb)...