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.
Utilizați utilitățile noastre de afișare pentru a comuta în mod receptiv valorile comune ale display
proprietăț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.
Bootstrap 4 este construit cu flexbox, dar nu toate elementele display
au 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: flex
la un element, faceți acest lucru cu .d-flex
sau cu una dintre variantele receptive (de exemplu, .d-sm-flex
). Veți avea nevoie de această clasă sau display
valoare pentru a permite utilizarea utilităților noastre suplimentare Flexbox pentru dimensionare, aliniere, spațiere și multe altele.
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-3
margin-right: 1rem
.mr-md-3
margin-right: 1rem
md
Când comutarea display
nu 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.