Manche HTML-Elemente können keinen Inhalt aufnehmen und bestehen deshalb aus einem einzigen Tag. Die Spezifikation nennt sie Void-Elemente, im Alltag heißen sie meist Self-Closing Tags.
- Self-Closing Tag (Void-Element)
Element, das keinen Inhalt aufnehmen kann und deshalb nur aus einem öffnenden Tag besteht.
Beispiel: „Ein Self-Closing Tag braucht keinen Partner, weil es nichts einschließt.“Auch: Void-Element, Leeres Element.
Welche Elemente das sind
<img src="/logo.svg" alt="Homepage Helden">
<br>
<hr>Die Spezifikation zählt sie abschließend auf: area, base, br, col, embed, hr, img, input, link, meta, source, track und wbr. Andere gibt es nicht, und die Liste wächst auch nicht beiläufig. Für diese Elemente gilt der Satz, dass ein schließendes Tag nicht angegeben werden darf.
Allen gemeinsam ist, dass sie nichts einschließen können. Ein Bild hat keinen Textinhalt, ein Zeilenumbruch auch nicht. Was sie leisten, steckt vollständig in ihren Attributen.
Der Schrägstrich am Ende
Viele schreiben ein Bild mit einem Schrägstrich vor der schließenden Klammer. Die Spezifikation ist dazu eindeutig: Bei diesen Elementen markiert er das Tag nicht als selbstschließend, er is unnecessary and has no effect. Der Browser liest beide Schreibweisen gleich.
Die Gewohnheit stammt aus XHTML, wo der Schrägstrich Pflicht war, weil dort jedes Element geschlossen sein musste. In HTML ist er Geschmackssache, und manche Code-Formatierer setzen ihn automatisch.
Wo er doch etwas bedeutet
Innerhalb von SVG und MathML gelten andere Regeln. Dort sind Elemente eingebettet, die aus einer anderen Sprache stammen, und für sie markiert der Schrägstrich das Tag tatsächlich als selbstschließend. Ein Kreis in einer Inline-SVG lässt sich so in einem Tag notieren.