初始化stylesheets变量添加css样式
首先我们需要有场景才能运用css
Scene scene = new Scene(grid, 300, 275);
把场景加入到stage
primaryStage.setScene(scene);
然后就可以为需要的场景添加css样式了
scene.getStylesheets().add(Login.class.getResource(“Login.css”).toExternalForm());
让stage显示出来
primaryStage.show();
接下来定义css样式下面演示如何改进标签控件的外观。
背景图被应用到了.root样式上，它表示会将样式应用到Scene实例的root节点上
.root {
记住对应的路径是与样式表的相对路径。
-fx-background-image: url(“url”);
}
下面演示如何改进标签控件的外观
.label {
本例中增加了字体的大小和字重，并且应用了一个灰色(#333333)的阴影。阴影的目的是增加深灰色字体与浅灰色背景之间的对比度。
-fx-font-size: 12px;
-fx-font-weight: bold;
-fx-text-fill: #333333;
-fx-effect: dropshadow( gaussian , rgba(255,255,255,0.5) , 0,0,0,1 );
}
观我们还可以为节点用.setId方法来为节点设置id从而为id设置css样式
创建一个文本框
Text scenetitle = new Text(“Welcome”);
为这个文本框设置id
scenetitle.setId(“welcome-text”);
在css样式单中:用#welcome-text为这个id添加css样式
#welcome-text {
文本”Welcome” 的字体大小增加到32点，并且字体变成了Arial Black。文本的填充颜色被设置为深灰色(#818181)并且应用了一个内阴影效果，创建了一个浮雕效果。你可以通过将文本的填充颜色设置为比背景色深一些的颜色来产生内阴影效果。
-fx-font-size: 32px;
-fx-font-family: “Arial Black”;
-fx-fill: #818181;
-fx-effect: innershadow( three-pass-box , rgba(0,0,0,0.7) , 6, 0.0 , 0 , 2 );
}
为按钮增加css样式
.button {
-fx-text-fill: white;
-fx-font-family: “Arial Narrow”;
-fx-font-weight: bold;
-fx-background-color: linear-gradient(#61a2b1, #2A5058);
-fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0.6) , 5, 0.0 , 0 , 1 );
}
.button:hover用在当用户将鼠标悬停在按钮上时,让按键发生变化这样的改变将使得用户能感知到按钮当前是否被激活。你可以使用hover伪类(pseudo-class)来实现。一个伪类由类选择器、冒号以及伪类名称构成
.button:initial表示没有效果
.button:hover {
-fx-background-color: linear-gradient(#2A5058, #61a2b1);
}
为更多的样式修改请查看官网给出的css参考指南
https://docs.oracle.com/javase/8/javafx/api/javafx/scene/doc-files/cssref.html#menubutton