Java FX菜单背景颜色错误？

Question

所以我遇到了一个非常奇怪的小问题。我已经设计了我的未装饰应用程序的菜单和菜单栏。如果我将菜单项悬停在上下文菜单中，菜单会将其背景颜色更改为默认的一个窗口。

场景图片（在第二张图片中，我正在徘徊＆＃39; Models＆＃39;菜单项）：

有谁知道如何修复蓝色背景？我希望菜单像第一张图片一样有我的悬停背景。菜单项也应该有自己的背景，如果我没有用鼠标在其上，则不会跳到蓝色。

CSS：

.menu-bar {
    -fx-background-color: transparent;
}
.menu {
    -fx-label-padding: 3px;
}
.menu .label, .menu-item .label {
    -fx-text-fill: #eee;
}
.menu:hover, .menu:focused, .menu:pressed {
    -fx-background-color: rgba(0, 0, 0, 0.2);
}
.menu-item:hover {
    -fx-background-color: rgba(0, 0, 0, 0.4);
}
.context-menu {
    -fx-background-color: rgba(0, 0, 0, 0.3);
}

提前谢谢。

Answer 1

将此添加到您的css

{{1}}

Answer 2

您要向.menu和menu-item添加多余属性。只尝试照顾有关的财产。例如，在您的情况下menu需要在hovered或showing事件中遵循您的着色模式。 所以添加

.menu:hover, .menu:showing{
  -fx-background-color: <preferred backgound>;
}

同样只将focused属性添加到menu-item，因为其余属性共享context-menu背景

.menu-item:focused{
  -fx-background-color: <preferred background>;
}

查看简单演示的快照：

Answer 3

您可以使用

.menu {
    -fx-background-color: #FFFFFF;
}

.menu .label {
    -fx-text-fill: black;
    -fx-font-family: verdana;
    -fx-font-size: 11.5px;
}

.menu:hover,
.menu:showing {
    -fx-background-color: #CCE8FF;
    -fx-text-fill: black;
}

.menu-item {
    -fx-background-color: #F2F2F2;
    -fx-text-fill: #000000;
    -fx-font-family: verdana;
    -fx-font-size: 11.4px;
}

.menu-item .label {
    -fx-text-fill: #000000;
    -fx-font-family: verdana;
}

.menu-item:focused .label {
    -fx-text-fill: #000000;
    -fx-font-family: verdana;
}

.menu-item:focused {
    -fx-background: -fx-accent;
    -fx-background-color: #91C9F7;
    -fx-text-fill: #000000;
    -fx-font-family: verdana;
}

.menu-item:disabled {
    -fx-background: -fx-accent;
    -fx-text-fill: #000000;
    -fx-opacity: 0.9;
    -fx-font-family: verdana;
}

.menu-item:focused:disabled {
    -fx-background: -fx-accent;
    -fx-background-color: lightgray;
    -fx-text-fill: #000000;
    -fx-font-family: verdana;
    -fx-opacity: 0.9;
}