博客列表 >简易版HTML表格基本结构

简易版HTML表格基本结构

kong
kong原创
2023年01月18日 17:46:08319浏览

参考文档

https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element#%E8%A1%A8%E6%A0%BC%E5%86%85%E5%AE%B9

标签

  1. table 表格数据
  2. caption 表格的标题
  3. tbody 内容主体
  4. thead 表格头部
  5. tfoot 表格尾部
  6. th 表头标题
  7. tr 行
  8. td 单元格

属性

  1. colspan 行合并
  2. rowspan 列合并

小案例

  1. <table border="1" width="600">
  2. <caption>
  3. php中文网课程表
  4. </caption>
  5. <thead>
  6. <th>星期一</th>
  7. <th>星期二</th>
  8. <th>星期三</th>
  9. <th>星期四</th>
  10. <th>星期五</th>
  11. <th>星期六</th>
  12. <th>星期日</th>
  13. </thead>
  14. <tbody>
  15. <tr>
  16. <td colspan="3"></td>
  17. <td>git</td>
  18. <td>html</td>
  19. <td>休息</td>
  20. <td>休息</td>
  21. </tr>
  22. <tr>
  23. <td>表格/表单</td>
  24. <td>媒体/框架元素/css</td>
  25. <td>未知</td>
  26. <td colspan="4" rowspan="2">春节</td>
  27. </tr>
  28. <tr>
  29. <td colspan="3" rowspan="1">春节</td>
  30. </tr>
  31. <tr>
  32. <td colspan="7">春节</td>
  33. </tr>
  34. </tbody>
  35. </table>

案例截图

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议