頁(yè)面中table寬度設(shè)置width="600px"之后,寬度仍然不是固定的,文字太長(zhǎng)后不換行,把table都撐變形了。
解決辦法:
1.table 設(shè)置 寬度,絕對(duì)寬度和相對(duì)都可以
table-layout:fixed ;
設(shè)置了這個(gè)屬性,其余所有td都是相同的寬度。
這樣操作之后,table是寬度固定了,但是里面的文章如果很長(zhǎng),文字會(huì)覆蓋
解決辦法:
在 td 里面 加上 style="word-wrap:break-word;" 自動(dòng)換行就好了,如果不想換行,可以將超出內(nèi)容設(shè)為隱藏,并且用省略號(hào)代替:
在td上面加
代碼如下:
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;(目前僅在IE8測(cè)試通過(guò))
推薦方法(2013-11-14 by 張雷)用div控制td的內(nèi)容
在TD中加
(1)超過(guò)寬度和高度文字會(huì)自動(dòng)隱藏
代碼如下:
<div style="width:100px;height:25px;overflow-x:hidden;overflow-y:hidden;">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
(2)設(shè)置了td的寬度超過(guò)長(zhǎng)度自動(dòng)換行
代碼如下:
<td><div style="width:100px;word-wrap:break-word;" >aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
</td>