如何将文本限制为 div 的宽度？答案

【问题标题】：How can I limit the text to a div's width?如何将文本限制为 div 的宽度？
【发布时间】：2016-09-25 17:09:12
【问题描述】：

我试图将文本限制为div 的宽度，但无法正常工作。

它说 TESTE3 我希望文本不要越过红色 div 的边缘。任何人都可以帮助我吗？ Image sample

【问题讨论】：

【解决方案1】：

我建议您使用内置代码编辑器或 jsfiddle 为我们提供示例代码。

但是有两种方法可以解决您的问题。

您可以选择overflow:hidden;，如下所示：https://jsfiddle.net/L62w981g/

或者您可以使用word-break 或white-space 让文本流到下一行，如下所示：https://jsfiddle.net/L62w981g/1/

这里是溢出修复的代码：

div {
  background-color:red;
  height:60px;
  overflow:hidden;
  width:350px;
}

<div>
kkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkthistextishidden
</div>

这是空白修复的代码：

div {
  background-color:red;
  height:60px;
  overflow:hidden;
  width:350px;
  word-break:break-all;
  white-space:normal;
}

<div>
kkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkthistextishidden
</div>

【讨论】：

【解决方案2】：

使用这个 CSS：

word-break: break-all;

【讨论】：