<span>: Das Content-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 Textinhalte, der an sich nichts repräsentiert. Es kann verwendet werden, um Elemente zur Stilzwecken zu gruppieren (mit den Attributen class oder id), oder weil sie gemeinsame Attributwerte wie zum Beispiel lang teilen. Es sollte nur verwendet werden, wenn kein anderes semantisches Element passend ist. <span> ist dem <div>-Element sehr ähnlich, aber <div> ist ein Blocklevel-Element, während <span> ein Inline-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 beinhaltet 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 Fließender Inhalt, Phraseninhalt.
Erlaubter Inhalt Phraseninhalt.
Tag-Auslassung Keine, sowohl der Start- als auch der End-Tag sind erforderlich.
Erlaubte Eltern Jedes Element, das Phraseninhalt akzeptiert, oder jedes Element, das Fließenden Inhalt akzeptiert.
Implizite ARIA-Rolle Keine entsprechende Rolle
Erlaubte ARIA-Rollen Beliebig
DOM-Schnittstelle [`HTMLSpanElement`](/de/docs/Web/API/HTMLSpanElement)

Spezifikationen

Specification
HTML
# the-span-element

Browser-Kompatibilität

Siehe auch