HTML表格显示方块、问号或空字符，90%是编码不一致所致；若内容可读但错位塌陷，则多为邮件客户端忽略结构所致。
确认乱码是编码问题还是结构解析失败
HTML 表格显示为方块、问号或“”字符，90% 是编码不一致导致的；但若表格内容能读、只是错位/塌陷，那大概率是邮件客户端或老旧渲染器把 当普通标签忽略了——比如 Outlook 2016 会直接丢弃 的 padding。先用浏览器开发者工具 Network 面板看响应头：Content-Type 是否含 charset=utf-8；再右键「查看页面源代码」，确认文件开头三字节不是 EF BB BF（即 UTF-8 BOM），否则可能触发 IE 兼容模式或 PHP 输出异常。重构表格前必须统一三处编码声明
缺一不可，且必须完全一致：
-
- 保存 HTML 文件时选「UTF-8 without BOM」——VS Code 右下角点击编码名 → 「Save with Encoding」→ 「UTF-8」；Notepad++ 选「编码」→ 「转为 UTF-8 无 BOM 格式」
- 后端输出时强制 HTTP 头：PHP 加
header('Content-Type: text/html; charset=utf-8');；Nginx 配置加 charset utf-8;；Apache .htaccess 加 AddDefaultCharset UTF-8
若旧表格数据来自数据库，还要检查 MySQL 连接是否设了 SET NAMES utf8mb4，否则 SELECT 出来的中文仍是乱码字节流。
用语义化表格替代 div 布局并禁用 CSS Grid/Flex
邮件和部分企业内网系统（如 Lotus Notes）根本不识别 display: grid 或 display: flex，所有「表格感」布局必须用原生 实现：- 外层容器固定宽度：用
，不要写 style="width:600px"
- 单元格对齐靠
，不用 text-align 或 vertical-align CSS
- 响应式靠嵌套：外层
宽 100%，内部每列用独立 控制宽度，避免 colspan 跨太多列
- 删掉所有
/，Outlook 会忽略它们的样式；表头统一用 | 姓名 | 示例片段：
DeepBI DHTML 页面生成器
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力：
- 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面；
- 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”；
- 提及位于 `apps/console/src/featur
下载
| 姓名 |
张三 |
| 邮箱 |
zhangsan@example.com |
图片与中文混合时特别注意路径和字体回退
表格里插图+中文，最容易崩在两处：
-
 data:image/png;base64,iVBORw... 一行到底）
- 中文字体不能依赖 Google Fonts 或
@import，只写 font-family: "Microsoft YaHei", "PingFang SC", sans-serif;；避免用 font-weight: bold，Outlook 会把它当无效声明直接剔除
- 表格单元格内中文换行失效？加
超长中文文本 white-space: normal
复杂点在于：有些老系统（如 IBM Notes）连 word-break 都不认，只能靠手动插入
| ——这不是妥协，是现实约束。 |
|
|
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
