HTML <var> 元素表示数学表达式或编程上下文中的变量名称。它通常使用当前字体的斜体版本来显示,不过这种行为取决于浏览器。
{{InteractiveExample("HTML Demo: <var>", "tabbed-shorter")}}
```html interactive-example
The volume of a box is l × w × h, where l represents the length, w the width and h the height of the box.
```css interactive-example
var {
font-weight: bold;
}
属性
本元素仅包含全局属性。
使用说明
相关元素
与 <var> 一同使用的元素一般包含:
- {{HTMLElement("code")}}:HTML 代码元素
- {{HTMLElement("kbd")}}:HTML 键盘输入元素
- {{HTMLElement("samp")}}:HTML 示例输出元素
如果遇到的代码是出于样式目的而不是语义目的地错误使用 <var>,应该使用带有适当 CSS 的 {{HTMLElement("span")}} 元素或者在下列元素中使用适当的语义元素。
- {{HTMLElement("em")}}
- {{HTMLElement("i")}}
- {{HTMLElement("q")}}
默认样式
大部分浏览器在渲染 <var> 元素时为 {{cssxref("font-style")}} 赋予 "italic" 样式,此样式可像这样由 CSS 覆盖:
var {
font-style: normal;
}
示例
基本示例
这里有一条基本示例,使用 <var> 来代表数学方程式的变量名称。
<p>一个简单的方程式:<var>x</var> = <var>y</var> + 2</p>
结果
{{EmbedLiveSample("基本示例", 650,80)}}
覆盖默认样式
使用 CSS 可以为 <var> 元素覆盖样式。在这个示例中,如果 Courier 字体可用,将使用该字体渲染变量名称,否则会回退至默认的等宽字体。
CSS
var {
font:
bold 15px "Courier",
"Courier New",
monospace;
}
HTML
<p>
变量 <var>minSpeed</var> 和
<var>maxSpeed</var> 控制设备的最低和最高速度,以每分钟转数(RPM)计算。
</p>
此 HTML 使用 <var> 来包裹两个变量的名称。
结果
{{EmbedLiveSample("覆盖默认样式", 650, 120)}}
技术概要
| 内容分类 | 流式内容、 短语内容、可感知内容。 |
|---|---|
| 允许的内容 | 短语内容。 |
| 标签省略 | 不允许,开始标签和结束标签都不能省略。 |
| 允许的父元素 | 任何接受短语内容的元素。 |
| 隐含的 ARIA 角色 | 没有对应的角色 |
| 允许的 ARIA 角色 | 任意 |
| DOM 接口 | HTMLElement |