Javafx accordion with transparent background?

问题:

Somehow accordion seems to behave differently than the other javafx elements, cause I cannot make its background transparent with CSS.

I found a hint somewhere with this:

.accordion.titled-pane > *.content {
   -fx-background-color: null;
}

But it didn't work. Maybe the syntax, I don't know, I tried without the > and * too...

My try was doing the same as with panels, so:

#leftTop{
    -fx-background-color: rgba(237, 243, 245, 0.8);
}

I set the fx:id. It doesn't work either. I made this with all the child nodes the same too, that are "above" the accordion itself, so with the titled pane and the anchor pane that is on the titled pane. The colouring part has its effect but not the transparency.

I have read that javafx had issues, but that comment was from 2013...

Do you know a solution? Thank you!

回答1:

You just need a space between .accordion and .titled-pane (the TitledPane is a child node of Accordion; without the space you are trying to match a single node that has both the style class accordion and the style class titled-pane):

.accordion .titled-pane > *.content{
    -fx-background-color: transparent ;
}

Note that if you want the title portion of the titled pane transparent, you can do that with

.accordion .titled-pane .title {
    -fx-background-color: transparent ;
}