首页 > 编程 > HTML > 正文

html表格的分区与分组控制

2020-03-24 17:53:10
字体:
来源:转载
供稿:网友
1. 表格的分区主要用 thead tbody tfoot 将表格分为头部,主体,尾部三分部

2. 这三个表格分区标签本身没有任何样式,仅仅是一个区块划分标记罢了

除了可以对表格进行分区控制外,还可以对每一列进行分组,这样可以快速的进行设置,提高效率

 !DOCTYPE html  html  head  meta charset= UTF-8  title 表格的分区与分组控制 /title  /head  body  table border= 1 cellspacing= 0 cellpadding= 5 align= center width= 80%  caption h3 岛国明星TOP50排行榜 /h3 /caption  !-- 对每一列进行分组控制 --  !-- colgroup :可以对一列进行整体控制,但能用的属性非常有限,通常要配合css才能发挥作用 --  !-- col 标签可对分到一组的每一列进行更加精准的控制 --  colgroup span= 1 bgcolor= lightgreen /colgroup  colgroup span= 1 bgcolor= lightgreen /colgroup  colgroup span= 2 bgcolor= lightyellow  !-- 对第三列单独控制 --  col bgcolor= lightgray  col  /colgroup  colgroup span= 2 bgcolor= cyan /colgroup  thead  !-- bgcolor可以设置行或单元格的背景颜色 --  tr bgcolor= skyblue  !-- th 标签内部文本默认会加粗居中显示,非常适合做表头 --  th ID /th  th 姓名 /th  th 腰围 /th  th 腰围 /th  th 臀围 /th  /tr  td align= center 01 /td  td align= center 波多野结衣 /td  td align= center 88 /td  td align= center 59 /td  td align= center 85 /td  /tr  td align= center 02 /td  td align= center 小泽玛利亚 /td  td align= center 90 /td  td align= center 60 /td  td align= center 85 /td  /tr  td align= center 03 /td  td align= center 浅川梨奈 /td  td align= center 87 /td  td align= center 61 /td  td align= center 88 /td  /tr  td align= center 04 /td  td align= center 深田恭子 /td  td align= center 86 /td  td align= center 62 /td  td align= center 88 /td  /tr  td align= center 05 /td  td align= center 苍老师 /td  td align= center 88 /td  td align= center 68 /td  td align= center 90 /td  /tr  /tbody  !-- tfoot:表格底部,目前暂时无内容,保持空即可 --  tfoot  /tfoot  /table  p align= center  a href= 首页 /a  a href= 上一页 /a  a href= 1 /a  a href= 2 /a  a href= 3 /a  a href= ... /a  a href= 下一页 /a  a href= 尾页 /a  /body  /html 

以上就是html表格的分区与分组控制的详细内容,html教程

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

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表