<span>: Das Inhalts-Span-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 <span> HTML-Element ist ein generischer Inline-Container für Phrasing-Inhalte, der grundsätzlich nichts repräsentiert. Es kann verwendet werden, um Elemente für Stilzwecke zu gruppieren (mithilfe der class- oder id-Attribute) oder weil sie Attributwerte, wie z. B. lang, gemeinsam haben. Es sollte nur verwendet werden, wenn kein anderes semantisches Element geeignet ist. <span> ist dem <div>-Element sehr ähnlich, aber <div> ist ein Block-Level-Element, während ein <span> ein Inline-Level-Element ist.

Probieren Sie es aus

<p>
  Add the <span class="ingredient">basil</span>,
  <span class="ingredient">pine nuts</span> and
  <span class="ingredient">garlic</span> to a blender and blend into a paste.
</p>

<p>
  Gradually add the <span class="ingredient">olive oil</span> while running the
  blender slowly.
</p>

span.ingredient {
  color: #f00;
}

Attribute

Dieses Element enthält nur die globalen Attribute.

Beispiel

Beispiel 1

HTML

html
<p><span>Some text</span></p>

Ergebnis

Beispiel 2

HTML

html
<li>
  <span>
    <a href="portfolio.html" target="_blank">See my portfolio</a>
  </span>
</li>

CSS

css
li span {
  background: gold;
}

Ergebnis

Technische Zusammenfassung

Inhaltskategorien Flussinhalt, Phrasing-Inhalt.
Zulässiger Inhalt Phrasing-Inhalt.
Tag-Auslassung Keine, sowohl der Anfangs- als auch der End-Tag sind erforderlich.
Zulässige Eltern Jedes Element, das Phrasing-Inhalt akzeptiert, oder jedes Element, das Flussinhalt akzeptiert.
Implizite ARIA-Rolle Keine entsprechende Rolle
Zulässige ARIA-Rollen Jede
DOM-Schnittstelle [`HTMLSpanElement`](/de/docs/Web/API/HTMLSpanElement)

Spezifikationen

Specification
HTML
# the-span-element

Browser-Kompatibilität

Siehe auch