Dienstprogramme für das Layout
Für eine schnellere mobilfreundliche und reaktionsschnelle Entwicklung enthält Bootstrap Dutzende von Hilfsklassen zum Anzeigen, Ausblenden, Ausrichten und Abstandhalten von Inhalten.
Änderndisplay
Verwenden Sie unsere Anzeigedienstprogramme , um allgemeine Werte der display
Eigenschaft reaktionsschnell umzuschalten. Mischen Sie es mit unserem Rastersystem, Inhalten oder Komponenten, um sie in bestimmten Ansichtsfenstern anzuzeigen oder auszublenden.
Flexbox-Optionen
Bootstrap 4 wurde mit Flexbox erstellt, aber nicht jedes Element display
wurde geändert, display: flex
da dies viele unnötige Überschreibungen hinzufügen und wichtige Browserverhalten unerwartet ändern würde. Die meisten unserer Komponenten werden mit aktivierter Flexbox erstellt.
Wenn Sie ein Element ergänzen müssen display: flex
, tun Sie dies mit .d-flex
oder einer der responsiven Varianten (z . B. .d-sm-flex
). Sie benötigen diese Klasse oder diesen display
Wert, um die Verwendung unserer zusätzlichen Flexbox-Dienstprogramme für Größenanpassung, Ausrichtung, Abstand und mehr zu ermöglichen.
Rand und Polsterung
Verwenden Sie die Dienstprogrammemargin
und Abstand , um den Abstand und die Größe von Elementen und Komponenten zu steuern. Bootstrap 4 enthält eine fünfstufige Skala für Abstandshilfsmittel, basierend auf einer Wertstandardvariable . Wählen Sie Werte für alle Darstellungsbereiche (z. B. für ) oder wählen Sie reaktionsschnelle Varianten aus, um auf bestimmte Darstellungsbereiche abzuzielen (z. B. um am Haltepunkt zu beginnen).padding
1rem
$spacer
.mr-3
margin-right: 1rem
.mr-md-3
margin-right: 1rem
md
Umschaltenvisibility
Wenn das Umschalten display
nicht erforderlich ist, können Sie die visibility
eines Elements mit unseren Sichtbarkeitsdienstprogrammen umschalten . Unsichtbare Elemente wirken sich weiterhin auf das Layout der Seite aus, sind jedoch für Besucher visuell verborgen.