HTML 知识量：9 - 26 - 70
在HTML中，rowspan是一个表格单元格（<td>或<th>）的属性，用于指定该单元格应纵向跨越多少行。使用rowspan可以实现合并行的效果，即多个单元格在垂直方向上合并成一个单元格。
例如，如果想要创建一个单元格，该单元格跨越两行，可以在相应的<td>或<th>元素中添加rowspan属性，并将其值设置为2。这样，该单元格就会占据原本应该属于下面一行的空间，从而合并了两行。
下面是一个简单的HTML示例，演示了如何使用rowspan来合并行：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Rowspan 示例</title> </head> <body> <table border="1"> <tr> <th>姓名</th> <th>年龄</th> <th>职业</th> </tr> <tr> <td rowspan="2">张三</td> <td>25</td> <td>工程师</td> </tr> <tr> <td>李四</td> <td>30</td> <td>设计师</td> </tr> </table> </body> </html>
在这个示例中，第二行的第一个单元格（包含“张三”的单元格）使用了rowspan="2"属性，因此它跨越了两行，与第三行的单元格合并。注意：由于第一行没有对应的单元格来合并，因此第二行的其他单元格（年龄和职业）会向上移动以填补空白。具体显示效果如下：
在HTML中，colspan是一个表格单元格（<td>或<th>）的属性，用于指定该单元格应横向跨越多少列。使用colspan可以实现合并列的效果，即多个单元格在水平方向上合并成一个单元格。
例如，如果想要创建一个单元格，该单元格跨越两列，可以在相应的<td>或<th>元素中添加colspan属性，并将其值设置为2。这样，该单元格就会占据原本应该属于下一列的空间，从而合并了两列。
下面是一个简单的HTML示例，演示了如何使用colspan来合并列：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Colspan 示例</title> </head> <body> <table border="1"> <tr> <th>姓名</th> <th>年龄</th> <th>职业</th> </tr> <tr> <td>张三</td> <td colspan="2">25岁，工程师</td> </tr> <tr> <td>李四</td> <td>30</td> <td>设计师</td> </tr> </table> </body> </html>
在这个示例中，第二行的第二个单元格（包含“25岁，工程师”的单元格）使用了colspan="2"属性，因此它跨越了两列，与原本应该属于第三列的单元格合并。注意，由于第一行没有对应的单元格来合并，因此第三列的头部单元格（职业）会正常显示。具体显示效果如下：
使用colspan和rowspan属性时，需要确保合并后的单元格总数与原始表格的单元格总数相匹配，否则可能会导致表格布局出现错误。此外，过度使用这些属性可能会使表格结构变得复杂和难以维护，因此建议在必要时谨慎使用。
Copyright © 2017-Now pnotes.cn. All Rights Reserved.
编程学习笔记 保留所有权利
MARK:3.0.0.20240214.P35
From 2017.2.6
