浅谈 html- table换行

这么久都没有来发表点总结了，看了园里的盆友发表的文章中，我发现自己也长进了不少。

但是，最近两天遇见了一个比较棘手的问题，就是在做web页面时，我用了一个table，这个页面是要供手机端调用的，所以在查看列表的时候（尤其是在查看评论这方面最常用），发现没有支持换行，在PC上看是没问题的，就是在手机端浏览的时候可能由于发表的内容过程致使页面不能换行，所以提出了可不可以支持一下换行的功能。可以呀，折腾了半天总算整出来了。以下是我总结的方法，希望能对一些盆友提供一些帮助吧。

首先介绍一个css控制table控制换行的标识：

word-break，有两个属性break-all，keep-all。第一种是强制性的换行，第二种则相反，就是强制性的不换行。

用法：可以在是否要换行的td标签中加上这个属性，这样就可以控制td内容是否换行了。

但是问题又来了，那就是中文和英文的不同时。自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法

那就是

style="table-layout: fixed"
style="word-wrap: break-word"  这两句很好用，而且也符合此时的需求。

但是怎么用呢，都加到table一行吗？试了试不行，效果实现不了，那是加到td里？试试还是不行，那就剩一种了，就是第一句加table里，第二句加td里结果居然实现了。

<table width="500" style="table-layout:fixed;">
<tr>
<td width="25%" style="word-break : break-all; ">abcdefghigklmnopqrstuvwxyz 1234567890
</td>
<td style="word-wrap : break-word ;">abcdefghigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table>

效果实现了。