应使用 显示空白单元格；<th>中仅含图标时须加scope属性；避免在<td>内嵌块级元素；数字日期禁用全角符号；动态填充优先用insertRow()/insertCell()；table-layout:fixed需配合<col>width；Excel导出时仅保留部分样式和属性。

HTML 表格里 <td> 和 <th> 填什么内容才不被浏览器忽略

空格、换行、制表符会被浏览器合并成一个空格，直接写 <td> </td> 看起来像有内容，实际渲染可能塌陷或对齐异常。

• 想显示空白单元格，用  （非断空格），不是普通空格
• <th> 里如果只放图标或符号（比如 ↑），记得加 scope 属性说明作用范围，否则屏幕阅读器无法理解
• 避免在 <td> 内嵌整个 <div> 或 <p> —— 表格单元格默认是 display: table-cell，内部块级元素会触发匿名盒子，可能影响垂直居中行为
• 如果填的是数字或日期，别用中文全角符号（如“：”“．”），否则 CSS 的 text-align: right 可能失效

用 JavaScript 动态填充 HTML 表格时，innerHTML 和 insertRow()/insertCell() 哪个更稳

直接拼字符串塞 innerHTML 简单，但容易 XSS，且 DOM 更新不触发表格相关事件（比如 onrowenter 这类旧 IE 遗留行为）；而原生方法更可控，但要小心索引越界。

• 用 insertRow(-1) 往末尾加行，比 insertRow(0) 更少出错——负索引明确表示追加，不用算当前有多少行
• insertCell() 返回的单元格节点，必须显式设置 textContent 或 innerText，不能只赋值给 innerHTML，否则可能执行脚本（尤其数据来自用户输入时）
• 如果表格已有 colgroup，动态插入的列宽不会自动继承，得手动读取 document.querySelector('colgroup col').style.width 再设到新 <td> 上

表格内容含长文本时，table-layout: fixed 和自动布局的区别在哪

默认表格是自动布局（table-layout: auto），浏览器要扫描所有内容才能确定列宽，遇到超长 URL 或无空格字符串会撑破容器；fixed 则按第一行或 col 定义来分配宽度，响应更快，但内容截断风险高。

html-to-pptx-converter

使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。

下载

• 启用 table-layout: fixed 后，<col> 的 width 属性才真正生效；没它的话，<col width="200"> 大概率被忽略
• 长文本溢出要靠 word-break: break-all 或 overflow-wrap: break-word，但注意 break-all 会在任意字符处断行（包括中文词中间），break-word 更友好
• 如果某列用了 white-space: nowrap，又没设最小宽度，整张表可能横向滚动失控——得配合 min-width 或媒体查询限制

导出 HTML 表格为 Excel 时，<table> 里哪些属性会被 Excel 忽略

Excel 打开 HTML 文件时，只认部分语义化标签和内联样式，很多 CSS 类、自定义属性、data- 前缀字段全丢弃。

• colspan 和 rowspan 能保留，但嵌套过深（比如 rowspan=5 跨了带 <tbody> 分隔的区域）会错位
• style="mso-number-format:'\@'" 这种 Office 专用样式可强制文本模式，防止 Excel 把 “00123” 当数字转成 “123”，但必须写在 <td> 或 <th> 上，父级无效
• 表格里用 <img src="data:image/png;base64,...>，Excel 打开后图片大概率不显示——得换成绝对路径或 Base64 + mso-attribute 组合，实操中基本放弃嵌入图

表格的复杂点不在怎么画格子，而在内容怎么进、怎么排、怎么出。尤其是跨系统流转时，同一份 HTML，在浏览器里看着正常，到 Excel 或打印预览里就错位，这种坑往往卡在某个没声明的 scope、漏掉的  、或者多写的 div 嵌套上。