<!DOCTYPE html>必须顶格写在第一行，否则浏览器必然进入怪异模式导致box-sizing失效、position:sticky不工作、document.title读不到；lang="zh-CN"是BCP 47强制标准，省略或写错会引发屏幕阅读器发音错误、拼写检查失配、SEO偏差及服务端hydration失败；<meta charset="UTF-8">须位于<head>内前1024字节，否则中文乱码且不可恢复。
!DOCTYPE html 必须顶格写在第一行，否则浏览器会进怪异模式——box-sizing 失效、position: sticky 不工作、document.title 读不到，不是“可能出错”，是必然失效。
为什么 lang 属性不能省，也不能写成 lang=""
写 lang="zh-CN" 是 BCP 47 标准强制要求：只写 zh 会让屏幕阅读器默认用繁体发音逻辑，拼写检查器匹配不到简体词库，Google 搜索也倾向返回繁体页面结果。服务端渲染（如 Next.js）中若 lang 值和服务端输出不一致，React/Vue 的 hydration 会直接报 DOM 差异错误。空值 lang="" 等价于未声明，浏览器按 undefined 处理，和没写一样。
meta charset 必须在 <head> 开头 1024 字节内
浏览器只扫描 <head> 前 1024 字节来确定字符集。一旦超限或位置靠后，中文立刻显示为乱码，且刷新也不恢复。实操顺序必须是：
-
<meta charset="UTF-8">——注意大小写：UTF-8，不能写成utf8或UTF8 <meta name="viewport" content="width=device-width, initial-scale=1.0"><title>
别用已废弃的 <meta http-equiv="Content-Type">，Chrome 120+ 会忽略它。
立即学习“前端免费学习笔记（深入）”；
VS Code 输入 ! + Tab 生成的骨架为什么可靠
它自动产出的结构严格满足三项硬性条件：第一行无空格/注释/BOM；lang 默认设为 en（你得手动改成 zh-CN）；meta charset 紧贴 <head> 后。但要注意：某些团队 CI 流程会校验 DOCTYPE 是否全小写，所以别手改成 <!doctype html> 或加空格——哪怕只多一个换行，都可能阻断部署。
真正容易被忽略的是：所有这些标签不是“可选装饰”，而是浏览器解析行为的开关。少一个、错一位、空一格，就可能让样式错乱、JS 读不到标题、SEO 归零——它们不是骨架，是开关。
