华企号 后端开发 HTML表格

HTML表格

表格示例1:

HTML表格插图

table标签就是表格的标签,用来建立一个表格

tr标签表示行,一个<tr></tr>标签就是一行

td标签表示数据单元格的内容,可以理解为列

th标签为表头单元格,和td不同的是,它在表格中会居中且加粗

tr要嵌套在table里面,td要嵌套在tr里

table标签里面可以有很多的属性可以设置,如下图所示:

HTML表格插图1

 

 

常见的还有一个height属性,用来设置表格的高

其实这些属性并不是table标签专属的,tr,th,td标签也可以设置一些属性,如<td align=”center”></td>

 

示例1在网页中的显示:

HTML表格插图2

为了更好的阅读代码,表格的第一行,即表头,可以用<thead></thead>包起来,表的主体可以用<tbody></tbody>包起来

以此实现实现收缩代码的功能,具体效果如下图所示:

HTML表格插图3

 

 

 

 

 

 合并单元格

HTML表格插图4

HTML表格插图5

 

表格示例2:

HTML表格插图6

 

 

具体效果如下:

HTML表格插图7

 

 

本身表格是一个三行三列的表格,由于第一行的第一个单元格跨行合并,且合并的个数为2,所以第二行第一个单元格的标签就应该删除

 

同理,由于第三行的第二个单元格跨列合并,所以第三行的第三个单元格的标签也应该删除

 

作者: 华企网通李铁牛程序员

我是程序员李铁牛,热爱互联网软件开发和设计,专注于大数据、数据分析、数据库、php、java、python、scala、k8s、docker等知识总结。15889726201 我的座右铭:"业精于勤荒于嬉,行成于思毁于随"
上一篇
下一篇

发表回复

联系我们

联系我们

028-84868647

在线咨询: QQ交谈

邮箱: tech@68v8.com

工作时间:周一至周五,9:00-17:30,节假日休息

关注微信
微信扫一扫关注我们

微信扫一扫关注我们

关注微博
返回顶部