<span> HTML-Inhalt-Span-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 <span> HTML-Element ist ein generischer Inline-Container für Phrasencontent, der an sich nichts repräsentiert. Es kann verwendet werden, um Elemente zu gruppieren, die für Styling-Zwecke (mithilfe von Attributen wie class oder id) oder weil sie gemeinsame Attributwerte haben, wie zum Beispiel lang. Es sollte nur verwendet werden, wenn kein anderes semantisches Element angemessen ist. <span> ist sehr ähnlich wie ein <div>-Element, jedoch ist <div> 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: red;
}
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, Phrasencontent. |
|---|---|
| Erlaubter Inhalt | Phrasencontent. |
| Tag-Auslassung | Keine, sowohl das Start- als auch das End-Tag sind erforderlich. |
| Erlaubte Eltern | Jedes Element, das Phraseninhalt akzeptiert, oder jedes Element, das Flussinhalt akzeptiert. |
| Implizierte ARIA-Rolle | Keine entsprechende Rolle |
| Erlaubte ARIA-Rollen | Beliebig |
| DOM-Schnittstelle | [`HTMLSpanElement`](/de/docs/Web/API/HTMLSpanElement) |
Spezifikationen
| Spezifikation |
|---|
| HTML # the-span-element |
Browser-Kompatibilität
Siehe auch
- HTML
<div>-Element