在html中使用span标记时，为换行符设置全边框底部

我想为句子设置下划线，但当它太长，屏幕太宽时，它会被打断成更多的线，并且会有空格，但并没有将下划线设置为下图的红线。那么，如何为所有空间设置下划线呢

这里是我的示例代码：

div>span{
垫底：10px；
边框底部：0.5px虚线#b4987e；
线高：48px；
}

辛昭达·卡莫恩古伊，台当测试结果为董洪川，丛。Neu Thung chua Thua Thua Thua Thua Thua Thua Thua toi rat vui，va cam on tat ca so giup do cua moi nguoi。

改为在div元素上使用背景。您还可以更好地控制破折号

.box{
线高：48px；
背景：
/*白色覆盖，仅显示距边框1px的距离*/
重复线性渐变（到底部，#fff 0 47px，透明0 48px/*与线高度相同的值*/），
/*虚线*/
重复线性渐变（向右，#b4987e 0 2px，透明0 4px）；
}

辛昭达·卡莫恩古伊，台当测试结果为董洪川，丛。Neu Thung chua Thua Thua Thua Thua Thua Thua Thua toi rat vui，va cam on tat ca so giup do cua moi nguoi。

改为在div元素上使用背景。您还可以更好地控制破折号

.box{
线高：48px；
背景：
/*白色覆盖，仅显示距边框1px的距离*/
重复线性渐变（到底部，#fff 0 47px，透明0 48px/*与线高度相同的值*/），
/*虚线*/
重复线性渐变（向右，#b4987e 0 2px，透明0 4px）；
}

辛昭达·卡莫恩古伊，台当测试结果为董洪川，丛。Neu Thung chua Thua Thua Thua Thua Thua Thua Thua toi rat vui，va cam on tat ca so giup do cua moi nguoi。

有一个简单的技巧可以解决您的问题

在父元素中，使用

overflow-y:hidden

并为其设置边框底部

并在子元素中使用

位置：relative

对于要填充父元素全宽的文本，请使用

文本对齐：justify

，如下例所示：

div{
溢出y：隐藏；
垫底：10px；
边框底部：0.5px虚线#b4987e；
文本对齐：对齐；
}
div>span{
填充底部：9px；
边框底部：0.5px虚线#b4987e；
线高：45px；
位置：相对位置；
顶部：15px；
}

辛昭达·卡莫恩古伊，台当测试结果为董洪川，丛。Neu Thung chua Thua Thua Thua Thua Thua Thua Thua toi rat vui，va cam on tat ca so giup do cua moi nguoi。

有一个简单的技巧可以解决您的问题

在父元素中，使用

overflow-y:hidden

并为其设置边框底部

并在子元素中使用

位置：relative

对于要填充父元素全宽的文本，请使用

文本对齐：justify

，如下例所示：

div{
溢出y：隐藏；
垫底：10px；
边框底部：0.5px虚线#b4987e；
文本对齐：对齐；
}
div>span{
填充底部：9px；
边框底部：0.5px虚线#b4987e；
线高：45px；
位置：相对位置；
顶部：15px；
}

辛昭达·卡莫恩古伊，台当测试结果为董洪川，丛。Neu Thung chua Thua Thua Thua Thua Thua Thua Thua toi rat vui，va cam on tat ca so giup do cua moi nguoi。