(JavaFX 8) css 按钮边框和背景颜色问题

Question

我正在尝试通过具有简单背景颜色和边框属性的 css 创建一个类似 Fallout 4 的按钮样式，实际上它运行良好。唯一的问题是边框没有覆盖整个按钮。按钮底部有一块背景突出。（见截图1）

当我单击按钮并按住鼠标时，它会消失，但不会完全消失。（见截图2）

这是我的css的一部分：

.button {
    -fx-background-color:transparent ;
    -fx-background-radius:0;
    -fx-border-color:transparent;
    -fx-border-width: 0 3 3 0;
}

.button:hover {
    -fx-background-color:lime;
    -fx-background-radius:0;
    -fx-border-color:black;
    -fx-border-width: 0 3 3 0;
}

知道什么可能导致这种情况吗？

Answer 1

为了重现该问题，您将需要场景上不止一个 Button 节点。视觉效果是由于按钮未聚焦时的背景插入引起的。为了避免附加-fx-background-insets: 0;的.button:hoverCSS规则和问题将得到解决。

.button:hover {
    -fx-background-color:lime;
    -fx-background-radius:0;
    -fx-border-color:black;
    -fx-border-width: 0 3 3 0;
    -fx-background-insets: 0;
}