Html <；u>；和预换行：带下划线的空格折叠在标记和文本之间-Chrome/Safari

我有一个项目，我需要保存和显示句子中所有带下划线的空格。我仍然需要折叠所有其他空间

我的css中有

u{white space:pre-wrap}

，但是Chrome和Safari正在压缩标签和文本之间的所有空白。它们确实保留了所有其他带下划线的空格

<u>     this     is     my     text     </u>

但Chrome将其显示为：

this____is_____my_____text_____

u{white space:pre}

工作正常，但是我丢失了下划线部分的换行

---

在

中是否有其他方法保留空白？或者通过某种方式让Chrome/Safari正常工作？

预包装应该可以工作，也许您使用的是Chrome或Safari的旧版本？这两种浏览器都使用webkit，所以webkit可能是问题所在，因为所有浏览器的渲染方式都不同。
如果您看到此表，您将看到预包装包装了空格。是铬的臭虫？大概但最好使用
pre
而不是
pre-wrap
，因为在这种模式下您不会遇到问题。Chrome很糟糕：）此属性的问题是，讨论可能会导致将来的草稿发生更改，属性的名称也可能会更改，并且一些值此时不起作用。建议的几个不起作用的值包括trim-inner、consume-before和consume-after，因为属性是继承的，这意味着or可能会导致删除更多的空白。查看更多：如果您想要解决方案。。。至少在Chrome中，将
span
与
文本装饰一起使用似乎是正确的。（此处无法测试Safari，不是最新版本）
this____is_____my_____text_____