html - 如何将动态的一段文字加下划线到行尾？

Question

我有一个要加下划线的动态段落(文本将不断更改)，但我希望下划线跨越到容器元素的右边缘，而不是停在文本末尾。如果您使用 text-decoration: underline 它只会在每行而不是整行中存在的文本下划线

我显然可以手动拆分行，然后使用边框底部来跨越整个宽度，但是文本是可变的并且可以更改，因此无法手动指定每一行。有没有一种方法可以在不拆分的情况下动态地为每一行添加下划线？

谢谢大家!

戴夫

Answer 1

不是真的 - 如果你想给文本而不是段落加下划线。
因为要么你定位一个 block 元素 - 在这种情况下你只能在底部加下划线，要么你定位一个内联元素 - 在这种情况下它不会延伸到边框。

您可以对齐文本，但它仍然不会在文本右边缘的最后一行下划线。

唯一的变通办法是使用固定的行高，并使用带有“下划线图像”的重复背景，这样文本看起来就带有下划线。
我强烈反对这样做，因为它在不同浏览器中的工作方式很可能不同。