thead是table的硬性依赖点而非可选项，必须为直接子元素、位于tbody前、仅含tr与th，否则导致sticky失效、打印无表头、JS操作错乱及屏幕阅读器语义丢失。
thead 不是“让表头看起来更专业”的可选项，而是浏览器解析、辅助技术识别、JS 操作和打印行为的硬性依赖点。漏掉它，position: sticky 固定表头会失效，打印时跨页无表头，table.tBodies 获取不到预期内容，屏幕阅读器读不出列关系——这些不是调试半天才浮现的问题，而是上线后立刻触发的故障。
为什么 thead 必须是 table 的直接子元素
浏览器在构建 DOM 时，只认 table > thead 这一层嵌套。任何中间包裹（比如 <div class="header-wrapper"><thead>...</thead></div>）都会被忽略或自动“修复”成无效结构。
- JS 动态插入时，必须用
table.appendChild(document.createElement('thead'))，而不是先 append 到某个 div 再塞进 table - 服务端模板（如 Vue/React SSR 或 PHP 渲染）中，条件判断导致
thead分支未命中，整个表格就失去语义锚点 -
position: sticky依赖thead作为最近的块级祖先容器；嵌套后，sticky 失效且无报错提示
thead 里只能放 tr，且 tr 里必须用 th
把 td 塞进 thead 看似能渲染出文字，但语义已断裂：屏幕阅读器不会把它当列标题处理，scope="col" 属性无效，DataTables 等库无法自动识别排序列。
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
-
th默认加粗居中，但样式可覆盖；关键在标签本身，不是视觉表现 - 多级表头（如“销售额”下分“Q1”“Q2”）需用
colspan/rowspan合理嵌套，但顶层容器仍是thead，不能用tbody顶替 - 行标题（如“上午”“下午”）要用
th scope="row"，且必须放在tbody的第一列，不能塞进thead
tbody 是唯一允许 JS 动态操作的数据区
对 table 直接调用 insertRow() 或遍历 rows 集合，会混入 thead 和 tfoot 的行，极易插错位置或破坏结构。
- 增删数据应限定在
tbody上：tbody.insertRow()、tbody.querySelectorAll('tr') -
table.tBodies[0]是安全入口，比table.rows更精确；table.tHead和table.tFoot也应单独引用 - 如果用了
display: block让tbody可滚动，记得补回表格单元格布局：tr { display: table-row; }、td, th { display: table-cell; }
最常被忽略的其实是顺序：HTML 规范强制要求 thead 必须出现在 tbody 之前，哪怕你用 CSS 把 tfoot 渲染在底部，DOM 中它也得写在 tbody 前面——否则 Safari 旧版、部分读屏软件会跳过表头或重复播报。
