CSS:自动换行并在需要时断词 | 自动换行并在需要时断词

本文介绍了CSS:自动换行并在需要时断词的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

如何设置div，使其可以换行并在必要时也可以断词?下面的示例用点表示div的宽度("zzzzzzz ..."是一个单词).

How can I set up a div such that it will wrap text AND will also break word if necessary? Examples below, with the dots showing the width of the div ("zzzzzzz..." is all one word).

....................................
您好，这些是
字

....................................
Hello these are
words

..........................................
zzzzzzzzzzzzzzzzzzzz
zzzzzz

....................................
zzzzzzzzzzzzzzzzzz
zzzzzz

推荐答案

您可以使用CSS 自动换行:break-word;

.wrap {
  width: 50px;
  word-wrap: break-word;
  border: 1px solid red
}

<div class="wrap">This is a mormal div wrapping and breaking words</div>

这篇关于CSS:自动换行并在需要时断词的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！