这是哪个JavaFX CSS属性？

Question

我在JavaFX中有这个表视图，我想在所选行周围放一个灰色边框，所以我添加了这个css规则：

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

然而，我似乎在途中丢失了一些填充，并且行显示向左移动。 （见图）

我应该添加一些填充属性吗？我是一个完整的CSS新手，在扫描caspian.css文件时无效：/

Answer 1

默认情况下，TableRow不会应用边框，因此行中的不同TableCell元素会占用该行的整个空间。

用你的css：

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

您正在为行应用边框，默认宽度为1像素。当选择行时，为了不干扰其余行，为了分配该边界，每个单元必须考虑其四个边中的每个中减少1个像素。

这意味着每个单元格缩短2个像素并且更窄，因此渲染时会向左移动，如发布的屏幕截图所示。

可以使用ScenicView轻松检查单元格大小更改。

虽然这可能是一个错误（与行选择一样，只应修改所有单元格的高度，在第一个单元格的左侧仅应用1个像素，在最后一个单元格的右侧仅应用1个像素），一个简单的解决方案，如果你看一下如何应用modena.css。

不使用边框颜色，单元格和行使用两种背景颜色，并在它们之间进行一些移动以创建边框效果。

.table-row-cell {
    -fx-background: -fx-control-inner-background;
    -fx-background-color: -fx-table-cell-border-color, -fx-background;
    -fx-background-insets: 0, 0 0 1 0;
    -fx-padding: 0;
    -fx-text-fill: -fx-text-background-color;
} 

对于每一行，下面的颜色由-fx-table-cell-border-color定义，底部有一个像素移位，顶部的主要颜色由-fx-background定义。选择表格行时，插图将移至-fx-background-insets: 0, 1。请注意，-fx-table-cell-border-color也被用作＆＃34;边界＆＃34;每个细胞的颜色。

应用自定义灰色边框颜色而不修改行内单元格的解决方案是：

.table-row-cell:selected {
    -fx-background-color: grey, -fx-background;
}

这样，您仍然保留行的顶部背景颜色和单元格的边框颜色。