设置table 的 style="table-layout:fixed;" 然后设置td的 style="word-wrap:break-word;" 即可
但这种情况下表格宽度自由分配,所以如果不用设置table 的 style="table-layout:fixed;"直接使用下面的代码也可以实现换行
word-wrap:break-word;word-break:break-all;
案例
<table style="TABLE-LAYOUT: fixed" border="1" cellspacing="0" cellpadding="0" width="200"> <tbody> <tr> <td style="WORD-WRAP: break-word" width="20">sssssssssssssssssssssssssssssssssssssssssssssss </td> <td>aaaaa</td> </tr> <tr> <td style="WORD-WRAP: break-word" width="20">sssssssssssssssssssssssssssssssssssssssssssssss </td> <td>aaaaa</td> </tr> </tbody></table>
例子二
<table border="1" cellspacing="0" cellpadding="0" width="200"> <tbody> <tr> <td style="word-wrap:break-word;word-break:break-all;" width="20">sssssssssssssssssssssssssssssssssssssssssssssss </td> <td>aaaaa</td> </tr> <tr> <td style="word-wrap:break-word;word-break:break-all;" width="20">sssssssssssssssssssssssssssssssssssssssssssssss </td> <td>aaaaa</td> </tr> </tbody></table>
比较好的写法
#soft-intro table{border:1px solid #cccccc; border-collapse:collapse; text-align:center; margin-top:0.54em; clear:both;width: 100%;}#soft-intro table th,#soft-intro table td{padding:8px; border:1px solid #dddddd;line-height:22px; text-align:left}#soft-intro table th{background:#f9f9f9;}#soft-intro table thead, #soft-intro table.jbborder tr {background-color:#fff;}#soft-intro table tr:nth-child(even){background-color:#f9f9f9}#soft-intro table tbody tr:hover {background: rgba(255,255,153,.4)}#soft-intro table th img{display:block; margin:5px auto 0;}#soft-intro table td{text-align:left;word-wrap:break-word;word-break:break-all;}#soft-intro table td.version{font-weight:bold;}#soft-intro table pre{width:auto;margin:0;padding:0;border:0;background:transparent}#soft-intro table td p{margin:0; padding:0;line-height:22px;word-wrap:break-word;word-break:break-all;}#soft-intro table ul{margin-top:2px;}