特定单词之间的强制换行

Question

我正在建立一个网站，我的标题包含一个长的第一个单词和两个较短的单词。

<h1>Looooooong short short.</h1>

如果屏幕足够宽，我希望这个标题适合一行，如果屏幕或容器对于所有三个单词都变得太窄，要在第一个和第二个之间断开，而不是第二个和第三个单词。

即。我想要这个：

Looooooong
short short

而不是这个

Looooooong short
short

如何在HTML / CSS中执行此操作？

Also on JSBin if you prefer: jsbin.com/puzemex

Answer 1

您可能想要使用不可破坏的空间：

short short

对于较长的文字，这里有一篇很好的文章：

http://blogs.adobe.com/webplatform/2013/01/30/balancing-text-for-better-readability/