Card mit Collapse-Funktion im Stil von Bootstrap
aus reinem HTMl und CSS, ohne JavaScript.
Für Bootstrap 5.3 optimiert. Damit ist der Dark-Mode einfach möglich.Die technischen Beschreibungen folgen noch.
Card mit Collapse
- Ohne JavaScript!
- Karte läßt sich einklappen (collapse).
- Aufgebaut auf den HTML Elementen
details
undsummary
, gestylt mit Bootstrap und etwas zusäzlichem CSS. - Kann man allen Bootstrap-Card-Klassen umgestylt werden.
- SEO-freundlich, da Standard HTML.
Zusammenfassung
Mit ein wenig CSS lassen sich Collapse-Bereiche komplett ohne JavaScript erzeugen.
Damit sparen Sie sich, für diese Fälle, die zusätzliche Übertragung der Datei
bootstrap.bundle.min.js
( 80.42 kB). Das spart Energie, Übertragungsvolumen, Speicherplatz und Ihre Seite wird schneller geladen.
Weitere Elemente
Software
Weiterführende Informationen
Downloads
Bootstrap-Bedienelemente ohne JavaScript | |||
Beispiele und CSS-Dateien. Für jedes Element ist eine einzelne CSS-Datei vorhanden.
| Download | ||
11.82 KB MIT | 147 |
Titel-Bild von Thorsten Willert, basierend auf der Startseite von Bootstrap. Bootstrap-Logo von Simple-Icons.