如何修改tabpane中的tab超出宽度时显示的弹出页面的样式

Question

如何修改我绘制红圈的样式？我最多能做的就是更改该按钮的样式。

.tab-pane-ui .control-buttons-tab .tab-down-button .arrow{
}
.tab-pane-ui .control-buttons-tab .tab-down-button{
}
.tab-pane-ui .control-buttons-tab{
}

我查看了 javafx css 文档，但没有任何结果。

Answer 1

这没有记录，但弹出窗口ContextMenu显示有样式类的所属节点tab-down-button。

So you can access the context menu in CSS with

.tab-down-button .context-menu {

    /* ... */
}

and use any of the context menu substructure from there.

For example:

style.css

.tab-down-button .context-menu .label {
    -fx-background-color: lightblue;
}

Here is a test application with the above style.css file:

package org.jamesd.examples.tabstyle;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Tab;
import javafx.scene.control.TabPane;
import javafx.stage.Stage;

import java.io.IOException;

public class HelloApplication extends Application {
    @Override
    public void start(Stage stage) throws IOException {
        TabPane tabPane = new TabPane();
        for (int i = 1 ; i <= 20; i++) {
            tabPane.getTabs().add(new Tab("Tab "+i));
        }
        Scene scene = new Scene(tabPane, 400, 400);
        scene.getStylesheets().add(getClass().getResource("style.css").toExternalForm());
        stage.setScene(scene);
        stage.show();
    }

    public static void main(String[] args) {
        launch();
    }
}

which produces