Remove gray bg behind the tabs in JFX


Question

So is there any way to remove the gray area behind the tab(s): example

I've tried to do this with CSS, but didn't find how.

1
18
5/15/2012 9:28:33 PM

Accepted Answer

JavaFX has a built-in default CSS sheet named caspian.css. Please read this post: https://stackoverflow.com/a/10149050/682495.
To change the default CSS, add this selector to your CSS file and customize it:

.tab-pane *.tab-header-background {
    -fx-background-color: -fx-outer-border, -fx-inner-border, derive(-fx-color, -20%);
    -fx-effect: innershadow(two-pass-box , rgba(0,0,0,0.6) , 4, 0.0 , 0 , 0);
}
9
5/23/2017 12:34:33 PM

To set the background color of the tabpane header write in the CSS file:

.tab-pane .tab-header-area .tab-header-background {
    -fx-background-color: yellow;
}


To remove the borders write:

.tab-pane .tab-header-area .tab-header-background {
    -fx-effect: null;
}


To remove the header completely set opacity to 0:

.tab-pane .tab-header-area .tab-header-background {
    -fx-opacity: 0;
}


More on style class tab-pane you can find here:
http://docs.oracle.com/javafx/2/api/javafx/scene/doc-files/cssref.html#tabpane


Licensed under: CC-BY-SA with attribution
Not affiliated with: Stack Overflow
Icon