<var>: 變數元素

Baseline 已廣泛支援

此特性已相當成熟,可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來,各瀏覽器均已提供此特性。

<var> HTML 元素表示數學表示式或程式設計上下文中的變數名。它通常會以當前字型樣式斜體顯示,但這種行為取決於瀏覽器。

試一試

<p>
  The volume of a box is <var>l</var> × <var>w</var> × <var>h</var>, where
  <var>l</var> represents the length, <var>w</var> the width and
  <var>h</var> the height of the box.
</p>
var {
  font-weight: bold;
}

屬性

此元素僅包含全域性屬性

用法說明

<var> 常用到的上下文中,其他也可能用到的元素包括:

  • <code>: HTML 程式碼元素
  • <kbd>: HTML 鍵盤輸入元素
  • <samp>: HTML 樣本輸出元素

如果您發現程式碼錯誤地為了樣式目的而不是語義目的而使用了 <var>,您應該使用帶有適當 CSS 的 <span> 元素,或者使用以下適當的語義元素之一:

預設樣式

大多數瀏覽器在渲染 <var> 時會應用 font-style: "italic" 樣式。您可以使用 CSS 覆蓋此行為,如下所示:

css
var {
  font-style: normal;
}

示例

基本示例

這是一個基本示例,使用 <var> 來表示數學方程中的變數名。

html
<p>An algebraic equation: <var>x</var> = <var>y</var> + 2</p>

結果

覆蓋預設樣式

您可以使用 CSS 來覆蓋 <var> 元素的預設樣式。在此示例中,變數名將以粗體顯示,如果可用則使用 Courier 字型,否則將回退到預設的等寬字型。

CSS

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

HTML

html
<p>
  The variables <var>minSpeed</var> and <var>maxSpeed</var> control the minimum
  and maximum speed of the apparatus in revolutions per minute (RPM).
</p>

此 HTML 使用 <var> 包裹了兩個變數的名稱。

結果

技術摘要

內容類別 流式內容語句內容、明顯內容。
允許內容 短語內容.
標籤省略 無,起始標籤和結束標籤都必須存在。
允許父級 任何接受短語內容的元素。
隱式 ARIA 角色 沒有對應的角色
允許的 ARIA 角色 任意
DOM 介面 HTMLElement

規範

規範
HTML
# the-var-element

瀏覽器相容性