问题
I'm fairly new to Scene Builder and JavaFXML. When I added a Label to my Anchor Pane, I couldn't change the Font of the Text and it's colour. Both the options have been greyed out and there's this CSS heading next to it. How can I not disable those options? This is the same case for the buttons too.

FXML file:
<?xml version="1.0" encoding="UTF-8"?>
<?import com.jfoenix.controls.JFXButton?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.VBox?>
<VBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="672.0" prefWidth="176.0" xmlns="http://javafx.com/javafx/8.0.141" xmlns:fx="http://javafx.com/fxml/1">
<children>
<AnchorPane prefHeight="188.0" prefWidth="176.0" style="-fx-background-color: #1c94d900;">
<children>
<Label fx:id="StudentUSN" layoutX="15.0" layoutY="145.0" prefHeight="24.0" prefWidth="146.0" />
</children>
</AnchorPane>
<VBox prefHeight="464.0" prefWidth="176.0">
<children>
<JFXButton fx:id="b1" prefHeight="44.0" prefWidth="176.0" style="-fx-background-color: #1156cf;" text="Attendance" />
<JFXButton fx:id="b2" disable="true" prefHeight="44.0" prefWidth="176.0" style="-fx-background-color: #1156cf;" text="Clubs" />
<JFXButton fx:id="b3" disable="true" prefHeight="48.0" prefWidth="176.0" style="-fx-background-color: #1156cf;" text="Results" />
<JFXButton fx:id="b4" disable="true" prefHeight="48.0" prefWidth="176.0" style="-fx-background-color: #1156cf;" text="Feedback" />
</children>
</VBox>
</children>
</VBox>
回答1:
Applying external CSS to FXML
Given the simple test:
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.AnchorPane?>
<AnchorPane id="AnchorPane" prefHeight="400.0" prefWidth="600.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8">
<children>
<Label layoutX="448.0" layoutY="49.0" text="Label" />
</children>
</AnchorPane>
and a separated css file:
.label {
-fx-font-family: Roboto;
-fx-text-fill: grey;
}

Without bundling a CSS file in the FXML file, you can add it to Scene Builder, so it will apply the styling to the preview.
This can be done from Preview->Scene Style Sheets->Add a Style Sheet...
.

Once the style sheet is applied, some settings can be locked, meaning that the value is already set in the css file.

Scene Builder preferences
Scene Builder has an internal preferences system that keeps track of different settings for the recent FXML files used.
For each file it saves:
- name
- path
- X, Y, width and height
- divider positions, visible panes
- ...
- and the external style sheets files added to the FXML file.
This means that if you close Scene Builder, and you come back a few days later, when opening the same FXML file, all those preferences will be restored and applied.
In the case posted by the OP, for some unknown reasons, the css file was removed, but the lock was still applied.
So the quick fix in this case is just editing the preferences file, and removing the document entry. All its settings will be lost, but there is nothing really important there.
Finding the preferences file
On Mac, the file can be found here:
/Users/<user>/Library/Preferences/com.oracle.javafx.plist
and it can be edited with Xcode.

On Windows, the preferences can be found at this key in the registry:
HKEY_CURRENT_USER\Software\JavaSoft\Prefs\com\oracle\javafx
and it can be edited with Regedit.
On Linux (possibly)
${user.home}/.java/.userPrefs/...
回答2:
Create a css file and add this style:
.label {}
Save your file and open SceneBuilder, Go to Preview->Scene Style Sheets->Add A Style Sheet... Select your .css file and try...
enter image description here
回答3:
If you go to
'preview' -> 'Themes'
you've probably selected a non-fx theme like Gluon Mobile light. Just select Modena, and all your properties will be enabled again.
Select a theme that does not disable CSS manipulation:
来源:https://stackoverflow.com/questions/47050845/label-font-and-text-fill-disabled-on-scene-builder