Html网页表格结构化标记该如何使用

Html表格的结构化

所谓的结构化，就是把我们的表格划分为三种：表头、表体、表尾。从而当我们在修改表体部分的时候，不会影响到其它两部分，从而解除了耦合，方便我们的应用。

结构化格式

 table  thead … /thead --------表头区  tbody … /tbody ---------表体区  tfoot … /tfoot ------------表尾区  /table 

总结：通过把表格划分为三部分，方便了我们对表格的编辑操作。

Html表格的标题

每个表格都有自己的标题，正如上述第二幅图片所示，那么又如何做到让标题随着内容来移动呢？

表格的标题

 table  caption … /caption  /table 

caption 下的属性值有：

属性名称

属性值

说明

align

Top

标题在表格上方

Bottom

标题在表格下方

小结：通过设置表格的标题，能够随时让标题跟着表格动。
Html直列化格式

什么是表格的直列化格式呢？我们平常在Excel中所见到的给整列加背景颜色，说的就是这么一回事。

 html  head  li 表格嵌套的使用一 /li  table width= 500  td align= center 学生成绩表 /td  /tr  table border= 1 width= 100%  thead  th 姓名 /th  th 语文 /th  th 数学 /th  th 外语 /th  /tr  /thead  tbody  td 张三 /td  td 95 /td  td 95 /td  td 95 /td  /tr  td 张三 /td  td 95 /td  td 95 /td  td 95 /td  /tr  td 张三 /td  td 95 /td  td 95 /td  td 95 /td  /tr  /tbody  tfoot  td colspan= 4 成绩汇总 /td  /tr  /tfoot  /table  /td  /tr  /table  br/  li 表格嵌套的使用二 /li  table border= 1 width= 500  caption align= bottom 学生成绩 /caption  thead  th 姓名 /th  th 语文 /th  th 数学 /th  th 外语 /th  /tr  /thead  tbody  td 张三 /td  td 95 /td  td 95 /td  td 95 /td  /tr  td 张三 /td  td 95 /td  td 95 /td  td 95 /td  /tr  td 张三 /td  td 95 /td  td 95 /td  td 95 /td  /tr  /tbody  tfoot  td colspan= 4 成绩汇总 /td  /tr  /tfoot  /table  br/  li 表格嵌套的使用三 /li  table border= 1 width= 500  caption align= bottom 学生成绩 /caption  col /col  col bgcolor=blue /col  thead  th 姓名 /th  th 语文 /th  th 数学 /th  th 外语 /th  /tr  /thead  tbody  td 张三 /td  td 95 /td  td 95 /td  td 95 /td  /tr  td 张三 /td  td 95 /td  td 95 /td  td 95 /td  /tr  td 张三 /td  td 95 /td  td 95 /td  td 95 /td  /tr  /tbody  tfoot  /tfoot  /table  /body  /head  /html 

相信看了这些案例你已经掌握了方法，更多精彩请关注php 其它相关文章！

相关阅读：

怎样用h5的sse服务器发送EventSource事件

H5的本地存储和本地数据库详细介绍

用H5和C3实现简单的时钟效果

以上就是Html网页表格结构化标记该如何使用的详细内容，html教程

郑重声明：本文版权归原作者所有，转载文章仅为传播更多信息之目的，如作者信息标记有误，请第一时间联系我们修改或删除，多谢。