需严格嵌套/才能渲染，缺任一层则内容被忽略；表语义标题，表数据，须配scope属性；边框需border-collapse:collapse+单元格border；动态生成须处理空值及colspan/rowspan，且必加。
把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。
直接用 <table> 就能创建数据表格，不需要 JS、不依赖框架，但结构写错或漏关键标签，浏览器会“默默吞掉”内容，而不是报错。
<h3>为什么 </h3>
<table> 里写了文字却看不到表格？
<p>因为 <code><table> 必须包含 <code><tr>，而 <code><tr> 必须包含 <code><td> 或 <code><th>。浏览器不渲染孤立的 <code><table> 或只写 <code><table><tbody>姓名</tbody></table> 这类结构——那段“姓名”会被当成纯文本塞到页面顶部，<table> 容器本身则空着。
<ul><li>错误写法：<code><table>姓名</table>（没 <tr>，没 <code><td>）
<li>正确写法：<code><table><tr><td>姓名</td></tr></table>
<table> → <tr> → <td>
<h3>怎样让表头和数据行语义清晰又不翻车？</h3>
<p><code><th> 不只是“加粗居中”，它告诉浏览器和屏幕阅读器“这是标题”，<code><td> 是“这是数据”。混用或全用 <code><td> 会让无障碍支持失效，也容易在后续加样式时出问题。
<ul><li>表头行统一用 <code><th>，放在第一行（或第一列），别在数据行里塞 <code><th>
<li>如果表格有横向表头（列名），给每个 <code><th> 加 <code>scope="col"；有纵向表头（如“合计”行），用 scope="row"
<tr>
<th>姓名</th>
<td>张三</td>
</tr> 这种混用——语义断裂，CSS 选择器也难精准控制边框看不见？不是没写对，是没合并边框
只给 <table> 加 <code>style="border: 1px solid #000;"，你会看到双线甚至四线边框，因为每个 <td> 都自带独立边框。真正起作用的是 <code>border-collapse: collapse。
- 必须把
border-collapse: collapse写在<table> 标签上，写在 <code><td> 上无效 <li>再统一给 <code><th> 和 <code><td> 加 <code>border: 1px solid #000;和padding，不然文字紧贴边框 - 调试时临时加
style="border: 1px solid red;"到所有<th>/<code><td>，能立刻看清哪些单元格被漏掉了 <h3>数据来自后端 JSON，怎么拼 <code><tr> 才不手抖？ <p>别手动敲一堆 <code><tr><td>...</td></tr>。用模板字符串 + 循环最稳，尤其当字段顺序可能变、或某条数据缺字段时。- 示例（JS）：
data.map(item => `<tr> <td>${item.name || ''}</td> <td>${item.age || '-'}</td> </tr>`).join('') - 注意空值处理：
item.city为null时，直接插进去会显示 “null”，得兜底 - 如果用了
colspan或rowspan，拼接时必须同步跳过对应位置的<td>，否则列数对不上，整行偏移 <p>最容易被忽略的是 <code><tbody> ——它不是可有可无的包裹层，而是浏览器解析表格结构的锚点。没它，JS 操作 <code>table.tBodies[0]会报错，CSS 里写tbody tr:hover也会失效。哪怕只有一组数据，也建议显式加上。
- 示例（JS）：
