javaFX 可以通过css来设计界面。javafx中的css只是w3c css2.1规范的一个扩展和子集，并不完全支持所有的css特性。
javafx中的css元素必须有-fx-前缀。
选择器分类：
Type选择器：通过Node的getTypeSelector可以获取
id选择器：通过设定id=属性（注意这里的id不是fx:id）
styleClass属性： styleClass可以使用class选择器
选择器命名规范：如ToggleButton需要写成：toggle-button
与w3c css语法的一些区别：
1.不支持@font?face, @-keyword 等
2.不支持层次伪类选择器
3.伪类:active,:focus等，在Nodes中变为:pressed, :focused
4.超链接伪类:link,:visited变为:visited
5.javafx中不支持逗号序列的值，如不能再-fx-font-family以逗号分隔同时指导fontsize等
6.javafx css使用HSB颜色模型代替HSL
7、javafx css不会对uri进行编码
关于Inheritance继承
举例：
Scene scene = new Scene(new Group());
scene.getStylesheets().add(“test.css”);
Rectangle rect = new Rectangle(100,100);
rect.setLayoutX(50);
rect.setLayoutY(50);
rect.getStyleClass().add("my-rect");
((Group)scene.getRoot()).getChildren().add(rect);.my-rect { -fx-fill: red; }.my-rect {
-fx-fill: yellow;
-fx-stroke: green;
-fx-stroke-width: 5;
-fx-stroke-dash-array: 12 2 4 2;
-fx-stroke-dash-offset: 6;
-fx-stroke-line-cap: butt;
}语法排错：
WARNING: com.sun.javafx.css.parser.CSSParser declaration Expected ‘<percent>‘ while parsing ‘-fx-background-color‘ at ?[1,49]
<url>[line, position]
radial-gradient(radius 100%, red, darkgray, black)
radial-gradient(focus-angle 45deg, focus-distance 20%, center 25% 25%, radius 50%, reflect, gray, darkgray 75%, dimgray)
image-pattern("images/Duke.png")
image-pattern("images/Duke.png", 20%, 20%, 80%, 80%)
image-pattern("images/Duke.png", 20%, 20%, 80%, 80%, true)
image-pattern("images/Duke.png", 20, 20, 80, 80, false)
image-pattern("images/Duke.png", 0, 0, imageWidth, imageHeight, false)Relative
Absolute
| aliceblue = #f0f8ff | antiquewhite = #faebd7 | aqua = #00ffff | aquamarine = #7fffd4 | ||||
| azure = #f0ffff | beige = #f5f5dc | bisque = #ffe4c4 | black = #000000 | ||||
| blanchedalmond = #ffebcd | blue = #0000ff | blueviolet = #8a2be2 | brown = #a52a2a | ||||
| burlywood = #deb887 | cadetblue = #5f9ea0 | chartreuse = #7fff00 | chocolate = #d2691e | ||||
| coral = #ff7f50 | cornflowerblue = #6495ed | cornsilk = #fff8dc | crimson = #dc143c | ||||
| cyan = #00ffff | darkblue = #00008b | darkcyan = #008b8b | darkgoldenrod = #b8860b | ||||
| darkgray = #a9a9a9 | darkgreen = #006400 | darkgrey = #a9a9a9 | darkkhaki = #bdb76b | ||||
| darkmagenta = #8b008b | darkolivegreen = #556b2f | darkorange = #ff8c00 | darkorchid = #9932cc | ||||
| darkred = #8b0000 | darksalmon = #e9967a | darkseagreen = #8fbc8f | darkslateblue = #483d8b | ||||
| darkslategray = #2f4f4f | darkslategrey = #2f4f4f | darkturquoise = #00ced1 | darkviolet = #9400d3 | ||||
| deeppink = #ff1493 | deepskyblue = #00bfff | dimgray = #696969 | dimgrey = #696969 | ||||
| dodgerblue = #1e90ff | firebrick = #b22222 | floralwhite = #fffaf0 | forestgreen = #228b22 | ||||
| fuchsia = #ff00ff | gainsboro = #dcdcdc | ghostwhite = #f8f8ff | gold = #ffd700 | ||||
| goldenrod = #daa520 | gray = #808080 | green = #008000 | greenyellow = #adff2f | ||||
| grey = #808080 | honeydew = #f0fff0 | hotpink = #ff69b4 | indianred = #cd5c5c | ||||
| indigo = #4b0082 | ivory = #fffff0 | khaki = #f0e68c | lavender = #e6e6fa | ||||
| lavenderblush = #fff0f5 | lawngreen = #7cfc00 | lemonchiffon = #fffacd | lightblue = #add8e6 | ||||
| lightcoral = #f08080 | lightcyan = #e0ffff | lightgoldenrodyellow = #fafad2 | lightgray = #d3d3d3 | ||||
| lightgreen = #90ee90 | lightgrey = #d3d3d3 | lightpink = #ffb6c1 | lightsalmon = #ffa07a | ||||
| lightseagreen = #20b2aa | lightskyblue = #87cefa | lightslategray = #778899 | lightslategrey = #778899 | ||||
| lightsteelblue = #b0c4de | lightyellow = #ffffe0 | lime = #00ff00 | limegreen = #32cd32 | ||||
| linen = #faf0e6 | magenta = #ff00ff | maroon = #800000 | mediumaquamarine = #66cdaa | ||||
| mediumblue = #0000cd | mediumorchid = #ba55d3 | mediumpurple = #9370db | mediumseagreen = #3cb371 | ||||
| mediumslateblue = #7b68ee | mediumspringgreen = #00fa9a | mediumturquoise = #48d1cc | mediumvioletred = #c71585 | ||||
| midnightblue = #191970 | mintcream = #f5fffa | mistyrose = #ffe4e1 | moccasin = #ffe4b5 | ||||
| navajowhite = #ffdead | navy = #000080 | oldlace = #fdf5e6 | olive = #808000 | ||||
| olivedrab = #6b8e23 | orange = #ffa500 | orangered = #ff4500 | orchid = #da70d6 | ||||
| palegoldenrod = #eee8aa | palegreen = #98fb98 | paleturquoise = #afeeee | palevioletred = #db7093 | ||||
| papayawhip = #ffefd5 | peachpuff = #ffdab9 | peru = #cd853f | pink = #ffc0cb | ||||
| plum = #dda0dd | powderblue = #b0e0e6 | purple = #800080 | red = #ff0000 | ||||
| rosybrown = #bc8f8f | royalblue = #4169e1 | saddlebrown = #8b4513 | salmon = #fa8072 | ||||
| sandybrown = #f4a460 | seagreen = #2e8b57 | seashell = #fff5ee | sienna = #a0522d | ||||
| silver = #c0c0c0 | skyblue = #87ceeb | slateblue = #6a5acd | slategray = #708090 | ||||
| slategrey = #708090 | snow = #fffafa | springgreen = #00ff7f | steelblue = #4682b4 | ||||
| tan = #d2b48c | teal = #008080 | thistle = #d8bfd8 | tomato = #ff6347 | ||||
| turquoise = #40e0d0 | violet = #ee82ee | wheat = #f5deb3 | white = #ffffff | ||||
| whitesmoke = #f5f5f5 | yellow = #ffff00 | yellowgreen = #9acd32 | transparent = rgba(0,0,0,0) |
原文：http://blog.csdn.net/xby1993/article/details/24833799