HTML文档必须以开头，且标签需包裹全部内容并唯一；和缺一不可，前者放元信息，后者放可见内容；字符编码必须为UTF-8且与声明一致。

HTML文档必须以 开头

不加这行，浏览器会进入怪异模式（Quirks Mode），CSS盒模型、表单默认样式、甚至 display: flex 都可能失效，而且不同浏览器表现不一致——不是“看起来差不多”，而是“根本没法对齐”。

它不是注释，也不是可选配置，是强制声明：告诉浏览器“请用 HTML5 标准解析这个文件”。

• 必须严格写在第一行，前面不能有任何空格、BOM 字符或注释
• 大小写不敏感，但惯例全小写；html 后面不加版本号（比如不用 ）
• 旧项目里看到 ..>，那是过时写法，直接替换为

标签必须包裹全部内容，且只能有一个

是整个文档的根节点，所有其他标签（包括 和 ）都必须是它的直接子元素或后代。漏写、多写、或把它放在 里，都会导致 DOM 结构异常。

常见错误现象：document.documentElement 返回 null；JavaScript 获取 document.body 为 undefined；CSS 中 html { font-size: 16px } 完全不生效。

DeepBI DHTML 页面生成器

生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur

下载

• 推荐加上 lang 属性，辅助屏幕阅读器和搜索引擎理解语言
• 不要在 外面写任何标签（比如误把
  放在最外层）
• VS Code 或 WebStorm 输入 ! 再按 Tab，自动生成的骨架里已包含正确结构，别手动删掉

和 缺一不可，但作用完全不同

不显示内容，只提供元信息； 才是用户真正看到的部分。把本该在 里的

或图片标签错放进 ，浏览器会自动将其移到 开头——但这属于容错修复，不是规范行为，JS 操作 DOM 时可能拿不到预期位置。
• 至少要包含 （防中文乱码）和 （浏览器标签页显示文字）
• 在响应式页面中必须存在，否则移动端会缩放错乱
• 里禁止出现 、、 等仅限 的标签

初学者最容易忽略的细节：字符编码与文件保存格式

即使 HTML 结构完全正确，如果文件本身保存为 ANSI 或 GBK 编码，而 却写着 UTF-8，中文照样会显示为方块或乱码——浏览器按声明去解码，但文件实际字节不是 UTF-8。

• 用 VS Code 打开 .html 文件，右下角查看编码格式，点击后选择 “Save with Encoding → UTF-8”
• Sublime Text 默认可能用系统编码保存，务必手动设置为 UTF-8 without BOM
• 记事本保存时，“另存为”对话框底部编码选项必须选 “UTF-8”，不能选 “ANSI” 或 “UTF-8-BOM”（BOM 会导致某些服务器返回异常头部）

结构对了，编码错了，等于白写。DOM 树能生成，但用户看到的是乱码，JS 读取 innerText 也是错的——这个点不检查，调试半天也找不到源头。