必须带lang属性,因其是浏览器、搜索引擎和屏幕阅读器识别页面主语言的唯一依据;lang="zh-cn"需小写且置于标签上,须在最前,不可缺失。

HTML文档结构里,、、 这三个标签本身不强制要求属性,但加对属性能解决实际问题:比如中文乱码、SEO不友好、移动端错位。硬套默认写法反而容易出 bug。
为什么 必须带 lang 属性
搜索引擎和屏幕阅读器靠 lang 判断语言类型。lang="zh-CN" 不只是“好看”,它直接影响拼音输入法候选词、语音朗读语调、甚至某些 CSS 伪类(如 :lang(zh))的行为。
- 没写
lang:部分无障碍工具会跳过文本,或用错误语种朗读 -
lang="zh"和lang="zh-CN"效果不同:前者泛指中文,后者明确指向简体中文(推荐用后者) - 值必须小写:浏览器对大小写敏感,
LANG="zh-cn"会被忽略
<meta charset> 放错位置就失效
<meta charset="UTF-8"> 必须在 内、且是前几行(最好第一行),否则浏览器可能已按默认编码(如 ISO-8859-1)解析了前面的 HTML,导致中文显示为乱码。
如果你了解HTML,CSS和JavaScript,您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造,可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序,然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流,并开始构建应用程序,提供更
- 常见错误:把它放在
<title></title>后面,或嵌套在<script></script>里 - UTF-8 是唯一推荐值:GBK 已淘汰,Windows-1252 等编码在中文环境下必然崩
- VS Code 自动生成的骨架里这行常被删掉——手动补上,别信模板
<meta name="viewport"> 不是可选配置
没有这行,移动端页面会以桌面宽度渲染,用户看到的是缩放后的小字,必须双指放大才能阅读。这不是样式问题,是视口初始化失败。
- 最简有效写法:
<meta name="viewport" content="width=device-width, initial-scale=1.0"> -
width=device-width表示视口宽度 = 设备物理宽度(不是 CSS 像素) - 漏掉
initial-scale=1.0:iOS Safari 可能默认缩放到 1.0,但 Android 某些 WebView 会设成 0.8,导致文字发虚 - 不要加
user-scalable=no:违反 WCAG 可访问性标准,且现代浏览器可能直接忽略
真正关键的不是“有哪些属性”,而是哪些属性在哪个位置不生效、不兼容、或被浏览器静默忽略——这些细节藏在加载顺序、大小写规则和规范演进里,而不是教程列表中。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!










