HTML 表跨度
HTML表格跨度
colspan - 列跨度
要將單元格跨多個列,請使用colspan
屬性。
分配給colspan
的值必須是整數。
您還必須刪除展開后的單元格將覆蓋的單元格元素。
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<tableborder="1">
<thead>
<tr>
<th>Rank</th>
<th>Name</th>
<th>Color</th>
<th colspan="2">Size & Votes</th>
</tr>
</thead>
<tbody>
<tr>
<th>2nd Favorite:</th>
<td>HTML</td>
<td>HTML</td>
<td>Oracle</td>
<td>MySQL</td>
</tr>
<tr>
<th>3rd Favorite:</th>
<td>XML</td>
<td colspan="2" rowspan="2">This is a test.</td>
<td>203</td>
</tr>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
</tr>
</tbody>
<tfoot>
<tr>
<th colspan="5">© 2011 www.w3cschool.cn Enterprises</th>
</tr>
</tfoot>
</table>
</body>
</html>
rowspan - 行跨度
要將單元格跨多行,您可以使用rowspan
屬性。您分配給此屬性的值是要跨越的行數。
分配給rowspan
的值必須為整數。
如果希望中間列中的一個單元格跨越所有三行,您將rowspan
屬性應用于單元格2。
您還必須刪除展開后的單元格將覆蓋的單元格元素。
以下代碼將單元格擴展為覆蓋多行。
<!DOCTYPE HTML>
<html>
<head>
<style>
td {border: thin solid black;padding: 5px;font-size: x-large
}
</style>
</head>
<body>
<tableborder="1">
<tr>
<td>1</td>
<td rowspan="3">2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>6</td>
</tr>
<tr>
<td>7</td>
<td>9</td>
</tr>
</table>
</body>
</html>