CSS 文本自动换行的方法详解

本节内容：
CSS 文本自动换行

首先，不换行的操作方法：
1，定死表格的宽度，即给表格一个宽度值（是数值，不是百分比）  
2，强制不换行
 

其次，自动换行
 

强制英文单词断行：
 

3，保证网页不会被撑开
 

注释：
1，第一条table{table-layout: fixed;}，此样式可以让表格中有!!!(感叹号)之类的字符时自动换行。

2，td{word-break: break-all}，在有些特殊情况下还是会撑开，因此需要再加上后面一句(word-wrap:break-word;)就可以解决。
此样式可以让表格中的一些连续的英文单词自动换行。

(1)语法：
 

参数：
 

(2)语法：
word-wrap : normal | break-word

参数：
normal : 　允许内容顶开指定的容器边界
break-word : 　内容将在边界内换行。如果需要，词内换行（word-break）也行发生

说明：
设置或检索当当前行超过指定容器的边界时是否断开转行。
对应的脚本特性为word-wrap。请参阅我编写的其他书目。

(3)语法：
table-layout : auto | fixed

参数：
auto : 　默认的自动算法。布局将基于各单元格的内容。表格在每一单元格读取计算之后才会显示出来。速度很慢
fixed : 　固定布局的算法。在这算法中，水平布局是仅仅基于表格的宽度，表格边框的宽度，单元格间距，列的宽度，而和表格内容无关

说明：
如何让表格自动换行？
设置或检索表格的布局算法。
对应的脚本特性为tableLayout。

4.按照网上大多数文章的说法，只要在CSS中加入：
 

就可以解决表格和层被撑破。

不过这样的代码会造成一个问题，英文词全部被截断了，这不符合英语的书写习惯也不利于阅读。

将代码修改为如下内容，即可既防止表格/层撑破又防止单词断裂。

例如:
 

大家可以试下，个人觉得还是很好用的。

以上就是本节css教程的全部内容，帮助大家了解css实现自动换行的方法，希望对大家有所帮助。