HTML5 总结(八)——表格标签

表格标签

正常情况下,表格不是用来布局的,常用来处理表格式数据。一般可将表格划分为头部、主体和页脚。

常用标签 说明 基本语法格式
table 可包含caption、thead、tbody、tr标签 <table></table>
caption 表格标题标签,定义表格的标题 <table><caption>表格的标题</caption></table>
thead 用于定义表格的头部,必须位于table标签中,一般包含网页的logo和导航等头部信息。 <thead></thead>
tbody 用来定义表格的主体,位于table标签中,一般包含网页中除头部和底部之外的其他内容。 <tbody></tbody>
tr 行标签,定义表格的行包含th或td <tr></tr>
th 表头标签,表头一般位于表格的第一行或第一列,设置表头只需用表头标签th代替单元格标签td,内容默认加粗、居中、垂直显示 <th>表头</th>
td 单元格标签,相当于容器,可以包含任何标签元素,常用属性包括rowspan和colspan等。 <td>内容</td>

单元格合并:跨行合并(rowspsn="(行数)"),跨列合并(colspan="(列数)")

代码示例:
<table>
	<caption>演员表</caption>
	<thead>    //头部
		<tr>	
			<th>姓名</th>
			<th>性别</th>
			<th>年龄</th>
		</tr>
	</thead>
	<tbody>    //主体
		<tr>
			<td>鸣人</td>
			<td>男</td>
			<td rowspan="2">18</td>  //跨行合并单元格
		</tr>
		<tr>
			<td>二柱子</td>
			<td>女</td>
	//		<td>18</td>
		</tr>
	</tbody>
</table>

发布了33 篇原创文章 · 获赞 3 · 访问量 739

猜你喜欢

转载自blog.csdn.net/qq_42188457/article/details/104670112