網站html表格單行占多列和單列占多行方法
作者：佚名 時間：2014-04-17 分享到：
網站表格單行占多列和單列占多行方法！
cospan屬性
用一個表格表頭來描述表格下有幾列，這是通常情況下的處理方法，我們在表10-1就用了表格表頭。在表格表頭或數據標簽中使用colspan屬性，可以將一行中的一個表格單元格擴展為兩列或更多列。將colspan屬性的值設為你希望擴展到的表頭或數據單元格的個數。例如:<td colspan=”3”>會告訴瀏覽器讓單元格占據它前面或后面3個單元格大小的水平寬度。瀏覽器會讓單元格內容充滿整個空間。
<p>如果在右面沒有足夠的單元格，那怎么辦呢?瀏覽器會將單元格擴展到它能擴展到的最多列數，它不會在每行后增加多的空白單元格來容納多余的colspan設置。可以在一行上增加所需但是無內容的單元格來解決這個問題。(如果你希望Netscape 為它們設置鑲嵌邊框的話，在它們的內容中加上一個<br>標簽就行了。)
rowspan屬性
<p>如同cospan屬性將一個表格單元格擴展為幾列一樣，rowspan屬性將一個單元格擴展到表格中的上下幾行.在你希望單元格開始的地方，在<th>或<td>標簽的最上行中包括rowspan屬性，并將其值設為你希望它擴展的行數。然后單元格會占據當前行和其后的幾行。瀏覽器會將單元格的內容填滿整個擴展空間。例如:<td rowspan="3“>會創建一個單元格，它占據當前行和其下面的兩行。
<p>和colspan屬性類似，瀏覽器會忽略那些擴展過度的rowspan屬性，并且只將當前單元格擴展到該行后明確用<tr>標簽定義的行。瀏覽器不會在一個表格內添加空白行，以填補表格內最后定義的一行后的空間。
將colspan和rowspan結合起來
<p>通過在表格表頭或數據標簽中既包括colspan屬性又包括}owspan屬性，可以將一個單元格擴展幾行和幾列。例如:<th colspan="3" rowspan="4">會如你希望的那樣，創建一個單元格，跨越三列四行，包括當前單元格，再向右擴展兩列，向下擴展三行。瀏覽器會將單元格的內容擴展到整個空間，根據當前列的對齊方式或那些在同一標簽中包括的屬性來對齊，如我們前面說過的那樣。
