<title> — das SVG-Zugänglichkeitsnamens-Element

Baseline Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.

Das <title> SVG Element bietet eine zugängliche, kurze Textbeschreibung für jedes SVG Containerelement oder Grafikelement.

Text in einem <title> Element wird nicht als Teil der Grafik gerendert, aber Browser zeigen ihn normalerweise als Tooltip an. Wenn ein Element durch sichtbaren Text beschrieben werden kann, wird empfohlen, diesen Text mit einem aria-labelledby Attribut zu referenzieren, anstatt das <title> Element zu verwenden.

Hinweis: Zur Rückwärtskompatibilität mit SVG 1.1 sollten <title> Elemente das erste Kindelement ihres Elternteils sein.

Verwendungskontext

Kategorien	Beschreibendes Element
Erlaubter Inhalt	Beliebige Elemente oder Zeichendaten

html,
body,
svg {
  height: 100%;
}

html

<svg viewBox="0 0 20 10" xmlns="http://www.w3.org/2000/svg">
  <circle cx="5" cy="5" r="4">
    <title>I'm a circle</title>
  </circle>

  <rect x="11" y="1" width="8" height="8">
    <title>I'm a square</title>
  </rect>
</svg>