2024-10-8
标签之文本标签
列表标签之有序列表
列表标签之无序列表
表格标签
实操
点击查看代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<table border="1" width="400" height="400">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
</table>
<table>
<tr>
<td>wc</td>
<td>wc</td>
<td>wc</td>
<td>wc</td>
</tr>
<tr>
<td>wc</td>
<td>wc</td>
<td>wc</td>
<td>wc</td>
</tr>
<tr>
<td>wc</td>
<td>wc</td>
<td>wc</td>
<td>wc</td>
</tr>
</table>
</body>
</html>
| 1 | 2 | 3 |
| 4 | 5 | 6 |
| 7 | 8 | 9 |
| wc | wc | wc | wc |
| wc | wc | wc | wc |
| wc | wc | wc | wc |
合并表格
点击查看代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>合并6，7：colspan</p>
<p>合并15，20：rowspan</p>
<p>水平合并：保留左边，删除右边</p>
<p>垂直合并：保留上边，删除下边</p>
<table border="1" width="500px" height="400px">
<tr>
<td>单元格1</td>
<td>单元格2</td>
<td>单元格3</td>
<td>单元格4</td>
<td>单元格5</td>
</tr>
<tr>
<td colspan="2">单元格6,7</td>
<td>单元格8</td>
<td>单元格9</td>
<td>单元格10</td>
</tr>
<tr>
<td>单元格11</td>
<td>单元格12</td>
<td>单元格13</td>
<td>单元格14</td>
<td rowspan="2">单元格15,20</td>
</tr>
<tr>
<td colspan="2" rowspan="2">单元格16,17,21,22</td>
<td>单元格18</td>
<td>单元格19</td>
</tr>
<tr>
<td>单元格23</td>
<td>单元格24</td>
<td>单元格25</td>
</tr>
</table>
</body>
</html>
合并6，7：colspan
合并15，20：rowspan
水平合并：保留左边，删除右边
垂直合并：保留上边，删除下边
| 单元格1 | 单元格2 | 单元格3 | 单元格4 | 单元格5 |
| 单元格6,7 | 单元格8 | 单元格9 | 单元格10 | |
| 单元格11 | 单元格12 | 单元格13 | 单元格14 | 单元格15,20 |
| 单元格16,17,21,22 | 单元格18 | 单元格19 | ||
| 单元格23 | 单元格24 | 单元格25 | ||
浙公网安备 33010602011771号