JavaFX实现Label覆盖父节点边框并隐藏下方边框（仅用CSS）

可以通过给Label添加伪元素，用与父节点背景相同的颜色覆盖其下方的父节点边框，同时调整Label的位置使其与父节点边框重叠。这种方法无需修改Label自身的背景属性，也不需要额外的容器节点。

具体CSS代码 #

/* 父节点样式 */
.parent-node {
    -fx-border-color: black;
    -fx-border-width: 3;
    -fx-border-radius: 8;
    -fx-background-color: white; /* 父节点背景色，伪元素将使用此颜色 */
    -fx-padding: 25 10 10 10; /* 顶部留出足够空间放置Label */
}

/* Label样式 */
.title-label {
    -fx-translate-y: -20; /* 向上偏移，让Label底部覆盖父节点的顶部边框 */
    -fx-font-size: 14px;
    -fx-font-weight: bold;
}

/* Label的伪元素，用于遮挡下方的边框 */
.title-label:after {
    -fx-content: "";
    -fx-display: block;
    -fx-height: 3px; /* 高度与父节点边框宽度一致 */
    -fx-background-color: white; /* 颜色与父节点背景色相同 */
    -fx-margin: 0 -6px; /* 左右延伸超出Label，确保完全覆盖边框 */
}

说明 #

1. 调整父节点的-fx-padding，顶部留出足够空间让Label偏移后不会挤压内部内容；
2. 通过-fx-translate-y将Label向上移动，使其底部与父节点的顶部边框重叠；
3. Label的:after伪元素高度设置为与边框宽度一致，背景色与父节点背景相同，左右延伸一点确保完全覆盖下方的边框；
4. 如果父节点背景色不是白色，只需将伪元素的-fx-background-color改为对应的颜色即可。

如果需要Label居中显示，只需给父节点添加-fx-alignment: top-center;，同时调整Label的左右margin或伪元素的延伸范围即可。

内容的提问来源于stack exchange，提问作者FARS