Html 停止包含跨距的单词的换行？

我对包含包装中的

span

的单词有一些问题

下面的代码看起来很复杂，但它所做的只是在单词“想象”中的所有i中添加彩色点

克洛尔奖想象实验室

我唯一的问题是单词在跨距处换行。我怎样才能阻止它那样做？我不想改变添加彩色点的方式

情况就是这样：

如果我在h2上加了一个no wrap，那么它会这样做（屏幕上的单词会消失）：

正在播放

删除空白 HTML将包括换行符和制表符在内的空白压缩为“单词”和内联元素之间的单个空格（某些例外情况适用）

---

克隆奖想象实验室

要么删除单词中的所有空白，要么使用

空白：nowrap

：

---

这些单词将自动换行。IlongWordLongWordLongWordLongWordInationation包装

您不能删除换行符和空格吗？请参阅：或者，您可以始终添加

空白：nowrap

…独立于您的问题，您可以通过使用css类来改进概述@Rob即使在更新的问题中，您仍然有一个标准的空格字符：

…预期的包装行为是什么？首先你暗示你不想让它在跨距处换行，然后你暗示你不想让整个单词脱离屏幕（而不是换行），这似乎是矛盾的。@gfullam我猜他想把整个单词换行，而不是分开。很抱歉，添加问题只是一个错误。即使在更新的问题中，您仍然有一个标准的空格字符：
。@gfullum我肯定我只是错误地将代码复制到我的问题中，但这是唯一的错误页面在-。。。当它缩小到手机大小时。我无法从这台计算机上查看该页面（并且指向外部站点的链接对后代不利）。你需要在你的问题中提供一个答案。刚刚更新了我的问题，以显示会发生什么。当减少页面向下更新的答案以容纳您确实想要换行的单词时，它就在这个页面上。因此，为了清楚起见，您在所有其他跨距周围添加了一个不换行的跨距？是的，就是这样。
<h2>The&nbsp;Clore&nbsp;Prize&nbsp; <span style="text-decoration: underline; color: rgb(255, 211, 0);">i</span>mag<span style="text-decoration: underline; color: rgb(0, 179, 223);">i</span>nat<span style="text-decoration: underline; color: rgb(238, 65, 34);">i</span>on&nbsp;lab</h2>

<h2>The&nbsp;Clore&nbsp;Prize&nbsp;<span style="text-decoration: underline; color: rgb(255, 211, 0);">i</span>mag<span style="text-decoration: underline; color: rgb(0, 179, 223);">i</span>nat<span style="text-decoration: underline; color: rgb(238, 65, 34);">i</span>on&nbsp;lab</h2>