HTML の変数要素 (<var>) は、数式やプログラムコード内の変数の名前を表します。挙動はブラウザーに依存しますが、通常は現在のフォントの斜体を使って表示されます。

コンテンツカテゴリ フローコンテンツ, 記述コンテンツ, 知覚可能コンテンツ
許可されている内容 記述コンテンツ
タグの省略 不可。開始タグと終了タグの両方が必要です。
許可されている親要素 記述コンテンツを受け入れるすべての要素
許可されている ARIA ロール すべて
DOM インターフェイス HTMLElement

属性

この要素にはグローバル属性のみがあります。

使用上のメモ

<var> がよく使われる文脈でよく使われる他の要素には、次のようなものがあります。

  • <code>: HTML コード要素
  • <kbd>: HTML キーボード入力要素
  • <samp>: HTML サンプル出力要素

もし、意味的な目的ではなくスタイル付けの目的で <var> が誤って使用されているのを見かけた場合は、 <span> と適切な CSS を使用するか、次のような適切な意味の要素を使用するかしてください。

既定のスタイル

多くのブラウザーは <var> の表示時に font-style"italic" を適用します。これは次のように CSS で上書きできます。

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

基本的な例

これは、 <var> を使用して数式の変数名を記述した単純な例です。

<p>単純な数式:
  <var>x</var> = <var>y</var> + 2 </p>

出力結果は次の通りです。

既定のスタイルの上書き

CSS を使用して、 <var> 要素の既定のスタイルを上書きすることができます。この例では、変数名は太字の Courier フォントがあれば、それを使って表示し、なければ既定の等幅フォントにフォールバックされます。

CSS

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

HTML

<p><var>minSpeed</var> と <var>maxSpeed</var> 変数は、
   機器の最低速度と最高速度を分当たりの回転数 (RPM) で
   制御します。</p>

この HTML では、2つの変数名を <var> を使用して囲んでいます。

結果

仕様書

仕様書 状態 備考
HTML Living Standard
<var> の定義
現行の標準  
HTML5
<var> の定義
勧告  

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOS 版 SafariSamsung Internet
基本対応Chrome 完全対応 ありEdge 完全対応 ありFirefox 完全対応 1IE 完全対応 ありOpera 完全対応 ありSafari 完全対応 ありWebView Android 完全対応 ありChrome Android 完全対応 ありEdge Mobile 完全対応 ありFirefox Android 完全対応 4Opera Android 完全対応 ありSafari iOS 完全対応 ありSamsung Internet Android 完全対応 あり

凡例

完全対応  
完全対応

ドキュメントのタグと貢献者

このページの貢献者: mfuji09, yuheiy, yyss, ethertank, Potappo
最終更新者: mfuji09,