Java開發桌面程式學習（十）——css樣式表使用以及Button懸浮改變樣式實現

one發表於2019-06-28
JavaCSS

css樣式表使用

javafx中的css樣式，與html的有些不一樣，javafx中的css，是以-fx-background-color這種樣子的，具體可以參考文件JavaFx css官方文件

javafx中，css樣式有兩種使用方法

  • 直接在fxml中使用
  • fxml引用css檔案

fxml直接使用樣式

在某個控制元件中使用style屬性即可

<Text layoutX="235.0" layoutY="173.0" style="-fx-background-color: black">hello</Text>

直接在scenebuilder中也可以定義

Java開發桌面程式學習（十）——css樣式表使用以及Button懸浮改變樣式實現

fxml引用css

在根佈局的標籤中使用stylesheets屬性，記得有個@符號

stylesheets="@button.css"

Button懸浮效果實現

css檔案中，引用id前面得加#，引用標籤，則加.

我們可以使用css的偽標籤來實現

預設為綠色，滑鼠滑動到按鈕，按鈕會變為藍色。點選按鈕，按鈕會變為白色，效果如下

Java開發桌面程式學習（十）——css樣式表使用以及Button懸浮改變樣式實現

.button{
    -fx-background-color: green;
}

.button:hover{
    -fx-background-color: blue;
}


.button:focused{
    -fx-background-color: white;
}

相關文章