Source

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 displayEigenschaft 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 displaywurde geändert, display: flexda 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-flexoder einer der responsiven Varianten (z . B. .d-sm-flex). Sie benötigen diese Klasse oder diesen displayWert, 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-3margin-right: 1rem.mr-md-3margin-right: 1remmd

Umschaltenvisibility

Wenn das Umschalten displaynicht erforderlich ist, können Sie die visibilityeines Elements mit unseren Sichtbarkeitsdienstprogrammen umschalten . Unsichtbare Elemente wirken sich weiterhin auf das Layout der Seite aus, sind jedoch für Besucher visuell verborgen.