css控制2行换行,CSS控制本文换行:word

在页面上对文本进行修饰的时候,特别是针对西文文本,往往会涉及到单词过长需要换行的问题(这里暂不讨论CJK系的文本)。本篇文章将会讨论两个用于控制文本换行的CSS属性word-wrap和word-break。

word-wrap

我们先来看看mozilla上如何定义word-wrap的。

The word-wrap CSS property is used to specify whether or not the browser may break lines within words in order to prevent overflow (in other words, force wrapping) when an otherwise unbreakable string is too long to fit in its containing box.

我们来尝试翻译一下这段定义,

word-wrap属性用于说明是否允许浏览器在单词内进行断句(换句话说,就是是否能够强制换行),这是为了防止当一个字符串太长而找不到它的自然断句点时产生溢出现象。

下图是word-wrap属性的详细内容,

css控制2行换行,CSS控制本文换行:word_第1张图片

其实有点CSS基础的人看到这段定义,应该就能明白这个CSS属性是干什么用的了。不过为了更加明白的阐述,我们下面来看个例子。

下面的页面是没有设置任何CSS换行控制的表现,

你可能感兴趣的:(css控制2行换行)