css - 控制换行符使线条宽度相等

Question

如果 h1 太长无法放在一行中并换行到下一行，我希望这两行的宽度大致相同。我到处寻找 CSS 解决方案，但没有成功。

CSS 真的不能做到这一点吗？这似乎是一件在很多情况下都很有用的简单事情，所以我真的很困惑，这显然不能用 CSS 完成。

谁能推荐某种解决方法，或者下一个最好的方法是什么？

澄清一下，这就是我的意思:

这里的标题太长，无法放在一行中，因此它换行到下一行文本

我想要的是:

这里的标题太长，放不下

单行，所以它换行到下一行文本

Answer 1

您可以尝试使用 max-width 和 word-break。请注意，如果您使用 word-break: all 可能会产生一些断字错误。

两个例子:

.example-1 {
  max-width: 610px; 
  width: 800px;
  word-break: break-word;
}

.example-2 {
  max-width: 610px; 
  width: 800px;
  word-break: break-all;
}

<div class="example-1">
  <h1>Here is a headline that's too long to fit on a single line, so it wraps to the next line of text</h1>
</div>

<div class="example-2">
  <h1>Here is a headline that's too long to fit on a single line, so it wraps to the next line of text</h1>
</div>