Das details-Element ermöglicht es, nur mit HTML einen Klappmechanismus in Ihre Seiten einzubauen.
Umschließen sie einen HTML-Block mit einem details-Element.
Bei einem Klick auf das details-Element öffnet sich der Block.
Das details-Element ermöglicht es, nur mit HTML einen Klappmechanismus in Ihre Seiten einzubauen.
Umschließen sie einen HTML-Block mit einem details-Element.
Bei einem Klick auf das details-Element öffnet sich der Block.
Mit dem summary-Element können Sie eigene Texte verwenden.
Daneben gibt es noch einen eingebauten marker, den Sie mit CSS stylen
können.
Wenn Sie mehrere details-Elemente über ein gemeinsames name-Attribut verbinden, werden beim Öffnen eines details-Elements bereits geöffnete details-Elemente ohne weiteres Zutun geschlossen.
Dies funktioniert (Stand: Dezember 2023) bereits in Chrome, Edge und Safari.
Interaktivität als Standardverhalten von nativen HTML-Elementen! - ganz ohne JavaScript!
In älteren Browsern bleiben die anderen details-Elemente aufgeklappt - graceful degradation,
bzw. progressive enhancement für Browser, die dies bereits unterstützen.