标签仅标注变量名语义，不渲染数学公式；适用于描述性文本中明确提及变量名的场景，如数学说明、api路径占位符等，不可替代或mathml。
var 标签不渲染数学公式，只标注变量名语义
<var></var> 标签在 HTML 中不是数学排版工具，它不参与公式结构、上下标对齐、字体选择或运算符间距控制。浏览器不会把它当作 <mi></mi>（MathML 中的标识符）处理，也不会自动适配 ISO 80000-2 等数学排版规范。它的唯一作用是向辅助技术（如屏幕阅读器）和开发者传递「这段文本是一个变量名」的语义信息。
常见错误现象包括：<math><var>x</var></math> 被忽略或报解析警告；<p><var>x</var> = 5</p> 中的 x 仅靠默认斜体撑场面，无数学语义保障。
什么时候必须用 <var></var> 标注变量名
只在描述性文本中明确提及「变量名本身」且上下文为数学或编程逻辑时才适用：
- 数学说明中强调符号含义：如“设
<var>r</var>为半径”，r是名字，不是数值 - API 文档中标出路径占位符：如
GET /api/users/<var>id</var>，id是需替换的参数名 - 函数调用描述中指代形参：如“调用
fetch(<var>url</var>)”，url是参数名，不是字符串字面量 - 配置说明中突出环境变量：如“将
<var>API_KEY</var>写入 .env 文件”
为什么不能用 <var></var> 替代 <code> 或 MathML
<var></var> 和 <code> 语义完全不同：<var></var> 表示“这是个被操作的变量名”，<code> 表示“这是段可执行/可复制的字面量”。二者常配合使用，但不可嵌套或混用：
✅ 正确：<p>面积 = <code>0.5 * base * height
base 和 height 是变量名
❌ 错误：<code><var>url</var> —— <var></var> 已含语义，嵌套冗余；更糟的是 <var><code>let x = 42，这既不是变量声明，也不符合任何标准
严肃数学表达（含积分、分式、矩阵）必须用 MathML 或 KaTeX 渲染；<var></var> 只负责“命名”，不负责“呈现”。
容易被忽略的兼容性与样式风险
<var></var> 默认渲染为斜体，但这只是浏览器 UA 样式，极易被项目级 CSS 重置覆盖（比如全局 * { font-style: normal; }）。一旦丢失斜体，语义视觉提示就归零，而屏幕阅读器仍会读作 “variable r”，造成人机理解错位。
若需支持下划线命名（如 _private），还需额外处理：<var><span>_private</span></var> 并配 CSS 控制下划线显示方式，否则下划线可能被误读为文本装饰而非命名约定。
老旧 IE（≤8）完全不识别 <var></var>，会当作未知 inline 元素处理——无样式、无语义、无辅助技术播报。当前虽已极少需兼容，但在内网文档或教育系统中仍可能遇到。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
