如何让文字在特定字符数时自动换行？ - CSS技巧 - 常规

<!DOCTYPE html>
<html>
  <head>
	<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<title>WebCat</title>
 <style>
 .container {
  display: flex;
}
<p>.item {
flex-grow: 1;
border: 1px solid black;
padding: 10px;
word-wrap: break-word;
word-break: break-all;
}
</style></p>
  </head>
  <body>	
	<div class="container">
  <div class="item">Short 回个话不开车vuvu个老夫IGIGi姑姑个 content</div>
</div> 
  </body>
</html>要让item里面的文字在18个字符的时候换行，可以使用CSS的属性`word-wrap`或`word-break`来实现。在item的样式中添加以下代码：
<pre><code class="language-css">.item {
  word-wrap: break-word;
  word-break: break-all;
}
</code></pre>
<p>这将使文字在达到18个字符时自动换行。</p>