Utilități pentru layout

Pentru o dezvoltare mai rapidă, prietenoasă și receptivă, Bootstrap include zeci de clase de utilitate pentru afișarea, ascunderea, alinierea și spațierea conținutului.

Schimbareadisplay

Utilizați utilitățile noastre de afișare pentru a comuta în mod receptiv valorile comune ale displayproprietății. Combinați-l cu sistemul nostru de grilă, conținutul sau componentele pentru a le afișa sau ascunde în anumite ferestre de vizualizare.

Opțiuni Flexbox

Bootstrap 4 este construit cu flexbox, dar nu toate elementele displayau fost modificate display: flex, deoarece acest lucru ar adăuga multe înlocuiri inutile și ar schimba în mod neașteptat comportamentele cheie ale browserului. Majoritatea componentelor noastre sunt construite cu flexbox activat.

Dacă trebuie să adăugați display: flexla un element, faceți acest lucru cu .d-flexsau cu una dintre variantele receptive (de exemplu, .d-sm-flex). Veți avea nevoie de această clasă sau displayvaloare pentru a permite utilizarea utilităților noastre suplimentare Flexbox pentru dimensionare, aliniere, spațiere și multe altele.

Marja și umplutură

Utilizați utilitățilemargin și spațierea pentru a controla modul în care elementele și componentele sunt distanțate și dimensionate. Bootstrap 4 include o scară pe cinci niveluri pentru utilități de spațiere, bazată pe o variabilă implicită de valoare. Alegeți valori pentru toate ferestrele de vizualizare (de exemplu, pentru ) sau alegeți variante receptive pentru a viza anumite ferestre de vizualizare (de exemplu, pentru a începe de la punctul de întrerupere).padding 1rem$spacer.mr-3margin-right: 1rem.mr-md-3margin-right: 1remmd

Comutarevisibility

Când comutarea displaynu este necesară, puteți comuta visibilityîntre un element cu utilitățile noastre de vizibilitate . Elementele invizibile vor afecta în continuare aspectul paginii, dar sunt ascunse vizual de vizitatori.