JavaFXImageView如何使用css悬停

我使用ImageView使用JavaFX制作了一些自定义按钮

<ImageView fitHeight="25.0" fitWidth="25.0" onMouseClicked="#doExit" onMouseEntered="#doHighLight" onMouseExited="#doReset" pickOnBounds="true" preserveRatio="true" AnchorPane.bottomAnchor="1.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" fx:id="xIcon">
    <image>
        <Image url="@imges/icons/x.png" />
    </image>
</ImageView>

正如你所看到的，这不是最好的方法，所以我尝试了一些css，但它不起作用。为什么?

#xIcon:HOVER {
    -fx-image: url('@../imges/icons/xSelected.png');
} 

文件位置如下：

/app/GuiController.java
/gui/style/main.css
/gui/imges/icons/x.png
/gui/imges/icons/xSelected.png

---

没有工作的原因有：

1） 为ImageView设置

id=“xIcon”

fx:id

和

id

是不同的属性。
2） 您不能使用

@

进行位置解析。在FXML文件中是，但不在CSS（JavaFX）文件中。
3） 伪类似乎不区分大小写。因此，请使用

：hover

而不是

：hover

---

有关更多信息，请参阅JavaFX的CSS参考指南。

是否

不区分大小写

有意包含一些额外的含义？否则，

区分大小写

似乎更简单。@naxagood catch:）。这是在一个问题的背景下，OP试图对伪类使用不区分大小写的方法，因此答案是“不区分大小写”。没有额外的意义。

/app/GuiController.java
/gui/style/main.css
/gui/imges/icons/x.png
/gui/imges/icons/xSelected.png