Verktøy for layout
For raskere mobilvennlig og responsiv utvikling inkluderer Bootstrap dusinvis av verktøyklasser for å vise, skjule, justere og skille mellom innhold.
Endredisplay
Bruk visningsverktøyene våre for responsivt å veksle felles verdier for display
eiendommen. Bland det med rutenettsystemet vårt, innholdet eller komponentene for å vise eller skjule dem på tvers av bestemte visningsporter.
Flexbox-alternativer
Bootstrap er bygget med flexbox, men ikke alle elementer display
har blitt endret til display: flex
, da dette vil legge til mange unødvendige overstyringer og uventet endre viktig nettleseratferd. De fleste av komponentene våre er bygget med flexbox aktivert.
Hvis du trenger å legge display: flex
til et element, gjør det med .d-flex
eller en av de responsive variantene (f.eks. .d-sm-flex
). Du trenger denne klassen eller display
verdien for å tillate bruk av våre ekstra flexbox-verktøy for dimensjonering, justering, avstand og mer.
Margin og polstring
Bruk avstandsverktøyenemargin
og til å kontrollere hvordan elementer og komponenter er fordelt og dimensjonert. Bootstrap inkluderer en skala på seks nivåer for avstandsverktøy, basert på en standardverdivariabel . Velg verdier for alle visningsporter (f.eks. for i LTR), eller velg responsive varianter for å målrette mot spesifikke visningsporter (f.eks. for —i LTR— fra bruddpunktet).padding
1rem
$spacer
.me-3
margin-right: 1rem
.me-md-3
margin-right: 1rem
md
Vekslevisibility
Når veksling display
ikke er nødvendig, kan du veksle visibility
mellom et element med våre synlighetsverktøy . Usynlige elementer vil fortsatt påvirke layouten på siden, men er visuelt skjult for besøkende.