本博客记录了HTML中table表格标签的使用,并记录了相关标签及属性的用法,同时介绍了单元格合并的两种方式(跨行合并和跨列合并)
  • 基本语法

        <table>

                <thead>

                        <tr><th></th></tr>

                </thead>

                <tbody>

                        <tr><td></td></tr>

                </tbody>

        </table>

  • 标签说明
标签 含义 说明
table 表格 表格的最外层标签
thead 表格的头部区域 表示表格头部内容
tbody 表格的主体区域 表示表格主体内容
tr 一行 表格中可以有多行
td 一个单元格 一行中可以有多个单元格
th 表头单元格 默认加粗居中
  • table的相关属性
属性 含义 说明
align 表格对齐方式 值有left(左)、center(中)和right(右)三种情况
border 表格边框 可以设置像素值(注意无单位),默认无边框(值为0)
width 表格宽度 可以设置像素值(无单位)或百分比
height 表格高度 可以设置像素值(无单位)或百分比
cellpadding 单元格内边距 像素值(无单位),规定单元格边沿与其内容之间的空白,默认1像素
cellspacing 单元格间距 像素值(无单位),规定单元格之间的空白,默认2像素
  • 合并单元格
合并方式 写法 说明
跨行合并 rowspan = "合并单元格的个数" 写到td标签内,后面行同一列指定数量的单元格会被合并
跨列合并 colspan = "合并单元格的个数" 写到td标签内,同一行后面列指定数量的单元格会被合并