标签不可省略，因其是html文档唯一根元素，省略会导致旧版ie忽略lang属性、base失效、:root不匹配、document.documentelement返回null，且现代构建工具强制保留以确保dom起点明确。
html 元素就是 HTML 文档的根元素，没有它，浏览器不会把文件当作合法 HTML 解析。它必须是整个文档中**最外层的成对标签**，且只能出现一次，位于 DOCTYPE 之后、head 和 body 之外。
为什么 html 标签不能省略？
省略 html 标签时，浏览器会进入“怪异模式”（Quirks Mode）或自动补全，但补全行为不可控：部分旧版 IE 可能忽略 lang 属性，base 元素失效，CSS 中的 :root 伪类无法匹配，JavaScript 的 document.documentElement 返回 null。现代构建工具（如 Vite、Webpack）生成的 HTML 模板也强制保留该标签，不是为了“规范”，而是为了确保 DOM 树起点明确。
html 元素的必需属性有哪些？
严格来说，html 元素本身没有必需属性——但它几乎总要带 lang：
-
lang="zh-CN"或lang="en"：直接影响屏幕阅读器发音、搜索引擎语言识别、CSS 的:lang()选择器匹配 -
xmlns="http://www.w3.org/1999/xhtml"：仅在 XHTML 文档中需要；HTML5 中可省略，加了也不报错，但无实际作用 -
manifest和version：已从 HTML5 标准中移除，继续使用会被浏览器忽略
常见嵌套错误：把 head 或 body 放到 html 外面
这种结构会导致解析失败或 DOM 异常：
<title>错！</title><p>内容</p><div class="aritcle_card flexRow artxards"> <div class="artcardd flexRow"> <a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill3458" title="html-ppt-to-pdf"><img src="https://img.php.cn/upload/skill/000/000/081/178956546773641.jpg" alt="html-ppt-to-pdf" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a> <div class="aritcle_card_info flexColumn"> <a rel="nofollow" href="/xiazai/skill3458" title="html-ppt-to-pdf" class="overflowclass">html-ppt-to-pdf</a> <p class="overflowclass">将使用 `<section class="slide">` 约定的 HTML 幻灯片转换为高保真、矢量文本 PDF（使用 Playwright + Chromium 原生 PDF 功能）。</p> </div> <a rel="nofollow" href="/xiazai/skill3458" title="html-ppt-to-pdf" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div>
正确写法只有一种顺序：
<title>正确</title><p>内容</p>
注意：head 和 body 是 html 的**直接子元素**，中间不能插入文本、注释或任何其他标签。哪怕多一个空格或换行符，在某些 XML 解析器里都可能触发错误。
最容易被忽略的一点：DOM 加载完成后，document.documentElement 指向的永远是 html 元素，而不是 body。所有全局样式重置、字体继承、滚动容器控制，都该从它出发考虑，而不是默认去操作 body。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
