由左柱高度

Question

streching HTML表格單元格所以我有表是這樣的： http://img607.imageshack.us/img607/5295/1stv.jpg

但我想這樣做一個： http://img684.imageshack.us/img684/3500/2ndjn.jpg

左列高度是不固定的。右側的行號也不固定。我想讓右邊的那些行按照左列高度同樣拉伸，並將整個間隙填充到底部，就像我的第二個示例一樣。

Answer 1

你可以嘗試使用table-layout:fixed

<table style='table-layout:fixed;'> 
<tr> 
<td>Hello World</td> 
<td>Hello World</td> 
</tr> 
<tr> 
<td>Hello World</td> 
<td>Hello World</td> 
</tr> 
<tr> 
<td>Hello World</td> 
<td>Hello World</td> 
</tr> 
</table> 

然後設置你的行和列的一些寬度和高度儘可能

Answer 2

這可能會實現：

HTML

<table> 
    <tr> 
    <th rowspan="0">pic</th> 
     <td>text</td> 
     <td>text</td> 
    </tr> 
    <tr> 
     <td>text</td> 
     <td>text</td> 
    </tr> 
    <tr> 
     <td>text</td> 
     <td>text</td> 
    </tr> 
</table> 

CSS

table { 
    table-layout: fixed; 
    border-collapse: collapse; 
    width: 100%; 
} 

td, th{ 
    border: 1px solid #000; 
    width: auto; 
} 

td+th { 
    width: auto; 
} 

th { 
    height:300px; 
} 

只要改變一個th的高度在CSS或添加不同大小的圖片到細胞。您也可以將可變數量的行添加到HTML。

注意！ rowspan=0可能只適用於Firefox和Opera。至少它不適用於Safari。如果您事先不知道行數，或者無法使用php或JavaScript來動態確定它，則可能需要向左側添加一張圖片，並在右側添加兩張圓角的表格。

也看到這個答案：Table with table-layout: fixed; and how to make one column wider