<var>:表示变量的元素

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

HTML <var> 元素表示数学表达式或编程上下文中的变量名称。它通常使用当前字体的斜体版本来显示,不过这种行为取决于浏览器。

尝试一下

属性

本元素仅包含全局属性

使用说明

相关元素

<var> 一同使用的元素一般包含:

  • <code>:HTML 代码元素
  • <kbd>:HTML 键盘输入元素
  • <samp>:HTML 示例输出元素

如果遇到的代码是出于样式目的而不是语义目的地错误使用 <var>,应该使用带有适当 CSS 的 <span> 元素或者在下列元素中使用适当的语义元素。

默认样式

大部分浏览器在渲染 <var> 元素时为 font-style 赋予 "italic" 样式,此样式可像这样由 CSS 覆盖:

css
var {
  font-style: normal;
}

示例

基本示例

这里有一条基本示例,使用 <var> 来代表数学方程式的变量名称。

html
<p>一个简单的方程式:<var>x</var> = <var>y</var> + 2</p>

结果

覆盖默认样式

使用 CSS 可以为 <var> 元素覆盖样式。在这个示例中,如果 Courier 字体可用,将使用该字体渲染变量名称,否则会回退至默认的等宽字体。

CSS

css
var {
  font:
    bold 15px "Courier",
    "Courier New",
    monospace;
}

HTML

html
<p>
  变量 <var>minSpeed</var><var>maxSpeed</var> 控制设备的最低和最高速度,以每分钟转数(RPM)计算。
</p>

此 HTML 使用 <var> 来包裹两个变量的名称。

结果

技术概要

内容分类 流式内容短语内容、可感知内容。
允许的内容 短语内容
标签省略 不允许,开始标签和结束标签都不能省略。
允许的父元素 任何接受短语内容的元素。
隐含的 ARIA 角色 没有对应的角色
允许的 ARIA 角色 任意
DOM 接口 HTMLElement

规范

Specification
HTML
# the-var-element

浏览器兼容性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
var

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support