Instant-Oberflächen
Version 4 des Frontend-Frameworks Bootstrap mit vielen Neuerungen
Mehr als zwei Jahre wurde an Bootstrap 4 gearbeitet. Zu den Verbesserungen der neuen Version zählen eine Cards-Komponente, ein verfeinertes responsives Raster und nützliche Hilfsklassen für die schnelle Formatierung. Das Update macht vieles einfacher, Entwickler müssen aber auch einiges neu lernen und ihren Workflow anpassen.
Für Release 4 wurde der Code von Bootstrap deutlich überarbeitet. Version 4 ist noch nicht komplett fertig – aktuell ist die zweite Beta. Größere Änderungen sind jedoch nicht mehr zu erwarten. Bootstrap steht in mehreren Formaten zum Herunterladen bereit: Für schnelle Experimente empfiehlt sich ein Download des Archivs, alternativ lässt sich das Framework aus dem CDN einbinden, das die Bootstrap-Gemeinde unterhält. Die Zeile
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.:
.com/bootstrap/4.0.0-beta.2/css/:
.bootstrap.min.css"
integrity="sha384-PsH8R72JQ3SOdhVi3u:
.xftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1po:
.vHYgTpBfshb" crossorigin="anonymous">
bettet die aktuelle Bootstrap-Version ein (siehe auch ct.de/yw9r ). Viele der Komponenten von Bootstrap benötigen zusätzlich die JavaScript-Bibliotheken jQuery und Popper.js.
Besser rastern
Das Grundprinzip seines responsiven, 12-spaltigen Rasters behält Bootstrap 4 bei. Das Raster wurde allerdings verfeinert. Mit dem Raster können Sie Elemente anordnen, indem Sie bestimmen, über wie viele Rasterspalten sie sich erstrecken sollen. Der folgende Code ordnet zwei Elemente nebeneinander an. Das erste ist mit 4 Spalten (col-4) halb so breit wie das zweite mit 8 Spalten (col-8):