1. 程式人生 > >設定table中的td寬度不同

設定table中的td寬度不同

類似站內簡訊的形式的一個table,想要的實現結果如下格式:

這裡寫圖片描述

剛開始覺得“這裡是名字”的td設定寬度為20%就可以了,程式碼如下:

 <table>
        <tr class="messageTrU">
            <td width="20%">這裡是名字</td>
            <td>
                割發代首過水電費和東莞市的分公司的分公司的分公司的分公司的風格是大法官水電費噶復讀還是介紹給是大法官啥地方個省份的花果山富商大賈的雙方各是梵蒂岡水電費和國際化更合適的風格水電費和國際化的風格和風格和是大法官
            </td
>
</tr> <tr class="messageTrTa"> <td> 大是大非噶啥等噶水電費噶啥的高發的所發生的法師打發到事發地是發的所發生的發的所發生的發大水發法大使館富商大賈水電費後如圖一提交給分行阿薩德掛號費更恐懼與對付光輝是大法官的非官方鬆德股房東說共多少個諷德誦功豐東股份電費過水電費 </td> <td width="20%">這裡是名字</td> </tr
>
</table>

然後效果如下:
這裡寫圖片描述

居然不是我想的那樣。

原因:
table中的td當寬度確定的時候,會選擇統一的寬度。
解決:

 <table>
        <tr class="messageTrU">
            <td width="20%">這裡是名字</td>
            <td colspan="2">
                割發代首過水電費和東莞市的分公司的分公司的分公司的分公司的風格是大法官水電費噶復讀還是介紹給是大法官啥地方個省份的花果山富商大賈的雙方各是梵蒂岡水電費和國際化更合適的風格水電費和國際化的風格和風格和是大法官
            </td
>
</tr> <tr class="messageTrTa"> <td colspan="2"> 大是大非噶啥等噶水電費噶啥的高發的所發生的法師打發到事發地是發的所發生的發的所發生的發大水發法大使館富商大賈水電費後如圖一提交給分行阿薩德掛號費更恐懼與對付光輝是大法官的非官方鬆德股房東說共多少個諷德誦功豐東股份電費過水電費 </td> <td width="20%">這裡是名字</td> </tr> </table>

在另一個80%的寬度裡設定屬性colspan=”2”,這樣一來該td實際是兩個td了,並且寬度不確定,這樣就實現了我的目的。