JavaFX - 删除 TableView 中列之间的蓝线

Question

我的 javafx 应用程序有一个 css 深色主题。一切都很好，除了一件事：当选择一个项目时，表视图中的列之间有一条蓝线：

这是我的 css 文件的样子：

.table-view {
    -fx-base: #1d1d1d;
    -fx-background-color: #1d1d1d;
    -fx-control-inner-background: #1d1d1d;
    -fx-table-cell-border-color: transparent;
    -fx-table-header-border-color: transparent;
    -fx-padding: 5;
}

.table-view .column-header-background {
    -fx-background-color: transparent;
}

.table-view .column-header, .table-view .filler {
    -fx-size: 35;
    -fx-border-width: 0 0 1 0;
    -fx-background-color: transparent;
    -fx-border-color: transparent transparent derive(-fx-base, 80%) transparent;
    -fx-border-insets: 0 10 1 0;
}

.table-view.column-header-background {
    -fx-background-color: transparent;
}

.table-view .column-header .label {
    -fx-font-size: 20;
    -fx-font-family: "Segoe UI Light";
    -fx-text-fill: white;
    -fx-alignment: center-left;
    -fx-opacity: 1;
}

.table-view:focused .table-row-cell:focused {
    -fx-border-color: derive(-fx-base, 20%);
    -fx-background-insets: 0 0 0 0;
}

.table-view:focused .table-row-cell:selected {
    -fx-background-color: derive(-fx-base, 20%);
    -fx-background-insets: 0 0 0 0;
}

Answer 1

你应该添加-fx-table-cell-border-color: transparent;到你的CSS中。创建一个新规则，例如：

.table-row-cell {
    -fx-table-cell-border-color: transparent;
}

或者只是将其添加到.table-view:focused .table-row-cell:focused：

.table-view:focused .table-row-cell:focused {
    -fx-border-color: derive(-fx-base, 20%);
    -fx-background-insets: 0 0 0 0;
    -fx-table-cell-border-color: transparent;
}

结果：