html - 如何将长字包装在固定宽度的列中

Question

业务需求是当文字超出宽度时进行换行。但是第二句话需要完全包裹起来。

eg. Welcome On-board.  
to be displayed as Welcome
                   on-board.  

但是它显示的是[First Line] Welcome on- 和[Second Line] board。

关于如何在 CSS 中处理这个问题有什么帮助吗？

Answer 1

如果你想使用 css，你可以使用 white-space: nowrap

Welcome <span style="white-space: nowrap;">On-board.</span>

相反，您可以只使用不间断的连字符:-

Welcome On‑board.

或者，您可以尝试使用 <NOBR>在“机上”周围标记。 (这个标签是非标准的...)

Welcome <NOBR>On-board.</NOBR>

_{关于使用 NOBR 的警告:
此功能是非标准的，不在标准轨道上。不要在面向 Web 的生产站点上使用它:它不适用于每个用户。实现之间也可能存在很大的不兼容性，并且行为可能会在未来发生变化。}