Hamburger-Menu
Bild zum Thema

Tag <span>

html css php mysql javascript
Bild zum Thema

Tag <span>

Definition

Status: Aktueller Standard


Das Tag <span> steht für span (Spanne, Bereich).
Der <span>-Tag ist ein zentrales Inline-Element in HTML, das verwendet wird, um einen Teil von Text oder anderen Inline-Elementen zu markieren, ohne selbst eine semantische Bedeutung hinzuzufügen. Er dient primär als Container für Styling (CSS) oder Skripte (JavaScript). Über das lang-Attribut können innerhalb eines deutschen Textes fremdsprachige Wörter für Screenreader oder Suchmaschinen korrekt markiert werden. <span>-Tags können ineinander verschachtelt werden, um komplexe Formatierungen zu erreichen. Eine zu tiefe Verschachtelung sollte jedoch wegen der Wartbarkeit vermieden werden. Ein <span> darf keine Block-Elemente (wie <div> oder <h1>) enthalten.

Syntax

<span>...</span>

Attribute bzw. Unterelemente

Global

Globale Attribute


Beispiele

= Tag

= Attribut

= Wert

Text
= Kommentar bzw. wichtig!
Beispiel <span> - verschachtelt und Inhalt von <span> mit CSS gestaltet

Der Code:
<p>Das ist ein <span class="tooltip">Fachbegriff
  <span class="tooltiptext">Hier steht die Erklärung!</span>
</span> im Lexikon.</p>
<hr>
<p>Wir gestalten <span class="highlight">digitale Erlebnisse</span> für Marken.</p>

Ergebnis:
Ergebnis: <span>-Demo 1
verschachtelt und Inhalt von <span> mit CSS gestaltet

Bei Touchscreens sieht man den Effekt durch anklicken.