如何在鼠标离开项目后重置JavaFX中的菜单项悬停颜色？

Question

我创建了一个 Java FXML文件并包含了 Css样式来创建一个窗口，如下所示：

这是我的CSS样式表

 html, body {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

body {
  background-color: red;
}

.cont {
  width: 150px;
  height: 150px;
  margin: 30px 15px;
  background-color: rgba(0,0,0,0)
}
.cont:after {
  content: "";
  display: block;
  width: 150px;
  height: 150px;
  box-shadow: 0px 10px 22px blue;

}

问题是当我从菜单项中留下鼠标时，

  

它仍然保持蓝色，不会变回白色。

希望有设计JavaFX菜单知识和经验的人能指导我实现结果。

Answer 1

可能是因为早上太早思考，但我认为你的文件中有不必要的CSS规则。在任何情况下，请使用以下规则（除了您的规则）：

.menu-item {
   -fx-background-color: white;
   -fx-padding: 5 20 5 20;
}

.menu-item:hover {
    -fx-background-color: -fx-focus-color;
}

我从你的css规则中删除了-fx-padding。以上只是将每个菜单项的背景颜色设置为白色和亮起：悬停规则我将其设置回默认选择颜色#039ED3，这与写-fx-focus-color相同。