我有以下 HTML 代码：
<a href="https://www.nothing.com/link" style="font-size:42px;text-decoration:none; color: #FFFCFC;white-space:nowrap;">this is just a <i>test sentence</i></a>
如您所见，我输入了“white-space:nowrap”以确保无论浏览器窗口大小如何，句子都保持在一行上。但是，似乎将句子中的某些单词斜体可以防止这种情况发生。在较小的浏览器窗口上，结果是在一行中显示“这只是一个”，然后在下一行显示“测试句子”。如何使句子始终保持在一行？
斜体不会导致换行。问题出在问题中未公开的样式表的某些部分（发布的代码未说明问题）。这可能是一个“杀手级 CSS 重置”，它真的很容易把事情搞砸。它可能类似于* { white-space: normal }，这自然会导致i元素内的正常换行，而不是让它white-space从其父级继承。
所以你应该清理你对 CSS 的使用，最好摆脱“CSS 重置”。仅重置真正需要重置的属性。
我在 FF 中也遇到过这个问题——同样的情况。
最快的解决方法是将字体大小设置为小一点，例如 90%。
我也没有任何CSS重置。
您可以尝试添加inline-block至少在 chrome 中有效的 href
<a href="https://www.nothing.com/link" style="font-size:42px;text-decoration:none; color: red;white-space:nowrap;display:inline-block">this here is a very long is just a<span style="font-style: italic"> test sentence</span></a>