<var>: Das Variable-Element

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.

Das <var> HTML Element steht für den Namen einer Variablen in einem mathematischen Ausdruck oder im Kontext der Programmierung. Es wird typischerweise unter Verwendung einer kursiven Version des aktuellen Schriftbilds dargestellt, obwohl dieses Verhalten von Browser zu Browser unterschiedlich sein kann.

Probieren Sie es aus

<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;
}

Attribute

Dieses Element enthält nur die globalen Attribute.

Anwendungshinweise

Verwandte Elemente

Andere Elemente, die in Kontexten verwendet werden, in denen <var> häufig verwendet wird, sind:

  • <code>: Das HTML Code-Element
  • <kbd>: Das HTML Keyboard-Eingabeelement
  • <samp>: Das HTML Beispielausgabe-Element

Falls Sie auf Code stoßen, der fälschlicherweise <var> für stilistische Zwecke anstelle von semantischen Zwecken verwendet, sollten Sie entweder ein <span> mit angemessenem CSS oder ein geeignetes semantisches Element aus den folgenden verwenden:

Standardstil

Die meisten Browser setzen font-style auf "italic", wenn <var> gerendert wird. Dies kann in CSS überschrieben werden, wie folgt:

css
var {
  font-style: normal;
}

Beispiele

Einfaches Beispiel

Hier ist ein einfaches Beispiel, das <var> verwendet, um Variablennamen in einer mathematischen Gleichung darzustellen.

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

Ergebnis

Überschreiben des Standardstils

Mit CSS können Sie den Standardstil für das <var>-Element überschreiben. In diesem Beispiel werden Variablennamen fett dargestellt und verwenden Courier, falls verfügbar, andernfalls wird auf die Standard-Schriftart in Monospace zurückgegriffen.

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>

Dieses HTML verwendet <var>, um die Namen von zwei Variablen einzuschließen.

Ergebnis

Technische Zusammenfassung

Inhaltskategorien Flussinhalt, Phrasing-Inhalte, spürbarer Inhalt.
Zulässiger Inhalt Phrasing-Inhalte.
Tag-Auslassung Keine, sowohl Start- als auch End-Tag sind erforderlich.
Erlaubte Eltern Jedes Element, das Phrasing-Inhalte akzeptiert.
Implizite ARIA-Rolle Keine entsprechende Rolle
Erlaubte ARIA-Rollen Beliebig
DOM-Schnittstelle [`HTMLElement`](/de/docs/Web/API/HTMLElement)

Spezifikationen

Specification
HTML
# the-var-element

Browser-Kompatibilität