table表格--合并单元格

来源:互联网 发布:棋牌游戏数据库 编辑:程序博客网 时间:2024/05/22 14:19

知识点概要:

1、colpan:横向合并"n"个单元格--n:默认=1

2、rowspan:纵向合并"n"个单元格--n:默认=1


代码demo:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><!-- 合并单元格 --><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>table--合并单元格</title><style type="text/css">td {text-align: center;}</style></head><body><!-- 横向合并单元格 --><table border="1" cellspacing="0" width="50%" height="240"><caption><font size="6">横向合并单元格</font></caption><!-- colpan:横向合并"n"个单元格     n:默认=1 --><tr> <td>姓名</td> <td colspan="2">班级+学号</td> </tr><tr> <td>张三</td> <td>1406401</td> <td>01</td> </tr><tr> <td>李四</td> <td>1406401</td> <td>02</td> </tr><tr> <td>关羽</td> <td>1406402</td> <td>01</td> </tr><tr> <td>张飞</td> <td>1406402</td> <td>02</td> </tr></table><br/><hr size="10pt" color="0000ff"><br/><!-- 纵向合并单元格 --><table border="1" cellspacing="0" width="50%" height="240"><caption><font size="6">横向合并单元格</font></caption><!-- rowspan="2":纵向合并"n"个单元格     n:默认=1 --><tr>             <td>班级</td> <td>学号</td> <td>姓名</td> </tr><tr> <td rowspan="2">401</td> <td>01</td> <td>张三</td> </tr><tr>                          <td>02</td> <td>李四</td> </tr><tr> <td rowspan="2">402</td> <td>01</td> <td>关羽</td> </tr><tr>                          <td>02</td> <td>张飞</td> </tr></table><br/><br/><br/></body></html>


页面显示:




0 0
原创粉丝点击