html - CSS 换行 : make second line bigger or specify word amount per line?

标签 html css

一个控制线可以用 CSS 换行吗？例如，我想用每行大约相同数量的单词换行。或者至少没有单字行。

原文:

很可能需要两行的很长的标题的一些词

理想情况下:

一个很长的标题的一些词这很可能需要两行

至少: 很长的标题的一些词很可能会占用两行

可以用 CSS 实现吗？

最佳答案

这绝对是可以实现的!只需给目标元素一个固定的 width :

div {
  width: 240px;
}

<div>Some words for a really long title that most likely will take two lines</div>

注意元素必须是 block-level (默认为 <div> )。如果你想使用 <span> 标签，例如，您需要应用 display: block 还有:

span {
  display: block;
  width: 240px;
}

<span>Some words for a really long title that most likely will take two lines</span>

显然，您需要根据要跨越多行的文本长度，尝试找到元素应有的确切宽度。

您可以使用可变宽度，尽管这会导致拆分到每行的文本量因不同的屏幕宽度而异。固定宽度可确保在所有设备上的每一行上显示完全相同数量的文本。

希望对您有所帮助! :)

关于html - CSS 换行 : make second line bigger or specify word amount per line?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47584762/