透過 rowspan 合併 HTML Table 表格欄位

HTML Table 的 rowspan 與 colspan 一樣都是合併表格欄位用的屬性，但差別在於 rowspan 用於合併垂直的表格欄位，而不是水平方向的欄位，而 rowspan 的語法規則與 colspan 其實蠻類似的，都是用在 td 標籤內，也都是用數字表示要合併的表格欄位數量，基本語法像這樣：

HTML Table rowspan 合併欄位語法規則
rowspan="要合併的垂直表格欄位數量"
rowspan 語法等號內的值是數字，例如 rowspan="2" 代表要垂直合併兩個表格欄位，rowspan="3" 代表要垂直合併 3 個表格欄位，以此類推。

用 Table rowspan 屬性創造合併垂直欄位範例
呈現效果
垂直合併後的欄位未合併的欄位
未合併的欄位
由範例的呈現效果可以清楚得看出，左邊的兩列垂直欄位已經合併為一個垂直欄位，這就是 Table rowspan 的合併效果，HTML 本身並沒有對 rowspan 進行合併欄位數量的限制，正常情況下都可以順利合併，讓表格呈現出最適合的格式。

若你要合併的儲存格是水平方向的，請看這篇：透過 colspan 合併 HTML Table 表格欄位。

還不知道 HTML 表格的設計規則嗎？快看這篇：HTML 表格設計篇 TABLE。
分享於 2014-07-21