移除JavaFX ScrollPane滚动条未聚焦状态下的边框

嘿，这个问题确实挺闹心的——明明给滚动条设了样式，结果失焦时边框又莫名其妙冒出来了！别慌，咱们来把它搞定。

问题根源 #

你的原有CSS只针对滚动条轨道的通用状态设置了边框透明，但JavaFX的默认样式里，未聚焦状态的滚动条轨道自带了边框样式，没被你的代码覆盖，所以一失焦边框就显出来了。

解决方案 #

只需要在CSS里明确覆盖未聚焦状态下的滚动条轨道边框样式，确保不管聚焦还是失焦，边框都保持透明。修改后的完整CSS代码如下：

/* 基础样式：统一所有状态下的滚动条轨道 */
.scroll-bar:horizontal .track,
.scroll-bar:vertical .track {
    -fx-background-color: transparent;
    -fx-border-color: transparent;
    -fx-background-radius: 2.0em;
}

/* 强制未聚焦状态下的轨道边框也为透明，覆盖默认样式 */
.scroll-bar:not(:focused):horizontal .track,
.scroll-bar:not(:focused):vertical .track {
    -fx-border-color: transparent;
}

逻辑说明 #

• :not(:focused) 这个伪类选择器专门匹配未处于聚焦状态的滚动条，在这里明确设置-fx-border-color: transparent，就能彻底覆盖JavaFX自带的未聚焦边框样式。
• 这样一来，不管ScrollPane是聚焦还是失焦，滚动条轨道的边框都会保持透明，完全符合你的需求。

如果你的代码里还有滚动条增减按钮（increment/decrement button）的样式，也可以用同样的逻辑，确保未聚焦状态下的样式统一哦！

内容的提问来源于stack exchange，提问作者Nat