使用CSS从焦点选项卡中删除发光边框

我正在尝试删除蓝色发光边框,当窗格聚焦在我的javaFX应用程序的tabpane中的选项卡时,该边框会出现。 关于如何在CSS中执行此操作的任何想法?

聚焦时的蓝色边框

这是我目前的css:

.tab{ -fx-background-radius: 0; -fx-background-color: derive(-fx-base, 0%); -fx-background-insets: 0.3; -fx-focus-color: XXXXXX; } .tab:hover{ -fx-background-color: derive(-fx-base, 20%); } .tab:selected{ -fx-background-color: derive(-fx-base, 60%); } 

但我不知道哪个值我应该给焦点颜色匹配背景derive(-fx-base, 60%)我可以看到差异,如果我将它设置为-fx-background-color我得到一个错误

实现此目的的一种方法是将边框颜色设置为透明。

 .tab-pane:focused > .tab-header-area > .headers-region > .tab:selected .focus-indicator { -fx-border-color: transparent; } 

您还可以直接设置焦点颜色和微弱焦点颜色(用于插入边框)。

 .tab-pane:focused > .tab-header-area > .headers-region > .tab:selected .focus-indicator { -fx-focus-color: transparent; -fx-faint-focus-color: transparent; } 

我在这里使用了特定的类,但它也适用于tab类。

 .tab { -fx-focus-color: transparent; -fx-faint-focus-color: transparent; } 

请尝试以下方法:

  .tab-pane > .tab-header-area > .headers-region > .tab:selected { -fx-focus-color: transparent; //red; }