java - JavaFX CSS行不会相交

当我为Sudoku网格创建内部边框时，只要碰到相交点，它的一部分就不会显示出来。但是，在我的Java代码中，如果删除了“ topBorder”或“ rightBorder”的两个“ for”循环中的任何一个，则边框将完全跨越网格。但是，如果存在两个“ for”循环，则边框的一部分将丢失。

CSS代码：

.topBorder {
-fx-border-color: black;
-fx-pref-width: 3em;
-fx-pref-height: 3em;
-fx-border-width: 3 0 0 0;
}

.rightBorder {
-fx-border-color: black;
-fx-pref-width: 3em;
-fx-pref-height: 3em;
-fx-border-width: 0 3 0 0;
}

示例Java代码：

for(int i = 0; i < 9; i++) {
                if((tf2D[col][row] == tf2D[i][3]) ||
                        (tf2D[col][row] == tf2D[i][6])) {
                    limitNumberTextField.getStyleClass().add("topBorder");
                }
            }

for(int j = 0; j < 9; j++) {
                if((tf2D[col][row] == tf2D[2][j]) ||
                        (tf2D[col][row] == tf2D[5][j])) {
                    limitNumberTextField.getStyleClass().add(
                            "rightBorder");
                }
            }

图片：

Missing border at intersection points

最佳答案

如果元素同时具有样式类topBorder和样式类rightBorder，则您将尝试应用两种边界样式（彼此矛盾）。发生这种情况时，将应用样式表中出现的最后一条规则，即您获得了该规则

-fx-border-color: black;
-fx-pref-width: 3em;
-fx-pref-height: 3em;
-fx-border-width: 0 3 0 0;

这显然没有提供顶部边框，因此具有这两种样式类的单元格的顶部都没有边框。

您可以尝试为具有两个样式类的单元格添加特定规则：

.topBorder {
-fx-border-color: black;
-fx-pref-width: 3em;
-fx-pref-height: 3em;
-fx-border-width: 3 0 0 0;
}

.rightBorder {
-fx-border-color: black;
-fx-pref-width: 3em;
-fx-pref-height: 3em;
-fx-border-width: 0 3 0 0;
}

.topBorder.rightBorder {
-fx-border-color: black;
-fx-pref-width: 3em;
-fx-pref-height: 3em;
-fx-border-width: 3 3 0 0;
}