700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > html表单元素的colspan和rowspan合并单元格

html表单元素的colspan和rowspan合并单元格

时间:2022-08-14 23:33:13

相关推荐

html表单元素的colspan和rowspan合并单元格

文章目录

colspan和rowspancolspanrowspan 代码案例

colspan和rowspan

colspan和rowspan这两个属性用于创建特殊的表格。

colspan

colspan用来指定单元格横向跨越的列数:colspan就是合并列的,colspan=2的话就是合并两列。

rowspan

rowspan用来指定单元格纵向跨越的行数:rowspan就是用来合并行的,比如rowspan=2就是合并两行。

rowspan通常使用在td和th标签中row:行,span:跨度,跨距,范围col:列,span:跨度,跨距,范围

代码案例

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title></head><body><table border="1" width="300"><caption>标准</caption><tr><td>1</td><td>2</td><td>3</td></tr><tr><td>4</td><td>5</td><td>6</td></tr></table><br><br><table border="10"><caption>合并</caption><tr><td>小组成员</td><td colspan="2" align="center">性别</td><td>年龄</td></tr><tr><td align="center">杨小菜</td><td>男√</td><td>女&nbsp</td><td>20</td></tr><tr><td align="center">杨大菜</td><td>男&nbsp</td><td>女√</td><td>20</td></tr><tr><td align="center">张大仙</td><td>男&nbsp</td><td>女√</td><td>20</td></tr><table border="1" width="300"><caption>合并第一行的三列</caption><tr><td colspan=3>合并第一行的三列</td></tr><tr><td>4</td><td>5</td><td>6</td></tr></table></br><table border="1" width="300"><caption>合并第一行的两列</caption><tr><td rowspan="2">合并第一列的两行</td><td>2</td><td>3</td></tr><tr><td>5</td><td>6</td></tr></table></table></body></html>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。