<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 Phrasierungsinhalte, das von sich aus nichts repräsentiert. Es kann verwendet werden, um Elemente für Styling-Zwecke zu gruppieren (unter Verwendung der class oder id-Attribute), oder weil sie gemeinsame Attributwerte wie lang teilen. 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 umfasst 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, Phrasierungsinhalt.
Erlaubter Inhalt Phrasierungsinhalt.
Tag-Auslassung Keine, sowohl das Start- als auch das End-Tag sind verpflichtend.
Erlaubte Eltern Jedes Element, das Phrasierungsinhalt akzeptiert, oder jedes Element, das Fließinhalt akzeptiert.
Implizite ARIA-Rolle Keine entsprechende Rolle
Erlaubte ARIA-Rollen Beliebig
DOM-Interface [`HTMLSpanElement`](/de/docs/Web/API/HTMLSpanElement)

Spezifikationen

Specification
HTML
# the-span-element

Browser-Kompatibilität

Siehe auch