JavaFX的CSS：更改TabPane標籤頭形狀

Question

我試圖改變Tab頭形狀css，但是當我看到在hereJavaFX的css參考，我找不到什麼都看透一個標籤的可訪問性css。我想要有一個梯形而不是矩形。任何想法如何完成這項任務？

Answer 1

您可以在任何情況下，檢查默認modena.css：

Tab■找的CSS類：.tab-pane > .tab-header-area > .headers-region > .tab

因此，例如，添加以下你的CSS文件：

.tab-pane > .tab-header-area > .headers-region > .tab { 
    -fx-background-radius: 20; 
} 

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

將導致如下：

梯形您需要使用-fx-shape屬性：

.tab-pane > .tab-header-area > .headers-region > .tab { 
     -fx-shape: "M300,290 L310,168 L410,168 L421,290 L300,290 z"; 
} 

.tab-pane:focused > .tab-header-area > .headers-region > .tab:selected .focus-indicator { 
    -fx-shape: "M300,290 L310,168 L410,168 L421,290 L300,290 z"; 
} 

這將導致：