JavaFX 中的 FXML 和 CSS 是兩種不同的技術，它們可以協同工作以創建美觀且功能豐富的用戶界面。FXML 主要用于定義界面的結構和布局，而 CSS 用于定義界面的樣式和外觀。

以下是如何在 JavaFX 項目中使用 FXML 和 CSS 的簡要指南：

1. 創建 FXML 文件：首先，你需要創建一個 FXML 文件來定義你的界面布局。FXML 文件是一種基于 XML 的語言，用于描述 JavaFX 場景圖的結構。你可以使用任何文本編輯器創建 FXML 文件，但建議使用支持 FXML 的集成開發環境（IDE），如 IntelliJ IDEA 或 Eclipse。

2. 編寫 FXML 代碼：在 FXML 文件中，你可以定義各種 JavaFX 控件（如按鈕、標簽、文本框等）并設置它們的屬性。例如：

   <Button text="Click me!" layoutX="100" layoutY="100" />
</AnchorPane>

3. 創建 CSS 文件：接下來，創建一個 CSS 文件來定義界面的樣式。CSS 文件可以包含顏色、字體、邊距等樣式信息。例如，創建一個名為 styles.css 的文件，并添加以下內容：

.button {
    -fx-background-color: #4CAF50;
    -fx-text-fill: white;
}

4. 將 CSS 文件應用到 FXML 文件：要將 CSS 文件應用到 FXML 文件，你需要在 FXML 文件的根元素中添加一個 stylesheets 屬性。例如：

   <Button text="Click me!" layoutX="100" layoutY="100" />
</AnchorPane>

請注意，stylesheets 屬性的值應該是 CSS 文件的相對路徑。

5. 在 Java 代碼中加載 FXML 文件：最后，在你的 Java 代碼中，你需要使用 FXMLLoader 類加載 FXML 文件并創建相應的 JavaFX 場景圖。例如：

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class Main extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("/path/to/your_fxml_file.fxml"));
        primaryStage.setTitle("JavaFX with FXML and CSS");
        primaryStage.setScene(new Scene(root, 300, 275));
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

現在，當你運行你的 JavaFX 應用程序時，它將加載 FXML 文件并應用 CSS 樣式，從而創建一個具有所需布局和外觀的用戶界面。