Aus dem Kurs: Bootstrap 5 Grundkurs

So erhalten Sie Zugriff auf diesen Kurs

Werden Sie noch heute Mitglied und erhalten Sie Zugriff auf mehr als 23.200 Kurse von Branchenfachleuten.

Inhalte bei Viewports verstecken

Inhalte bei Viewports verstecken – Tutorial zu Bootstrap

Aus dem Kurs: Bootstrap 5 Grundkurs

Gratismonat starten Für Ihr Team erwerben

Inhalte bei Viewports verstecken

“

Einzelne Bereiche lassen sich bei bestimmten Viewports verstecken. Wie funktioniert das? Prinzipiell wird zum Verstecken die CSS-Angabe display: none verwendet und im Bootstrap heißt die entsprechende Klasse "d-none". Um etwas anzuzeigen, wird hingegen auf "display: block" gesetzt, und da können Sie immer zusätzlich auch die Angaben für die verschiedenen Breakpoints schreiben. Also, angenommen, Sie schreiben "d-none", dann bedeutet das, das Element ist versteckt. Wenn Sie aber zusätzlich angeben "d-sm-block", dann ist es ab der Größe Small, das sind 576 Pixel, sichtbar. Sie können diese Angaben auf die unterschiedlichsten Arten kombinieren, also wenn ich schreibe "d-sm-none", dann ist das Element zuerst sichtbar, wenn wir jetzt von einem sehr kleinen Viewport ausgehen; ab der Größe Small ist es nicht sichtbar und wenn ich zusätzlich aber schreibe "d-md-block", dann ist es ab der Größe Medium wieder sichtbar, und das bedeutet, es ist nur bei der Größe Small versteckt. Sie können auch…

Inhalt