Verktøy for layout
For raskere mobilvennlig og responsiv utvikling inkluderer Bootstrap dusinvis av verktøyklasser for å vise, skjule, justere og skille mellom innhold.
Bruk visningsverktøyene våre for responsivt å veksle felles verdier for displayeiendommen. Bland det med rutenettsystemet vårt, innholdet eller komponentene for å vise eller skjule dem på tvers av bestemte visningsporter.
Bootstrap 4 er bygget med flexbox, men ikke alle elementer displayhar 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: flextil et element, gjør det med .d-flexeller en av de responsive variantene (f.eks. .d-sm-flex). Du trenger denne klassen eller displayverdien for å tillate bruk av våre ekstra flexbox-verktøy for dimensjonering, justering, avstand og mer.
Bruk avstandsverktøyenemargin og til å kontrollere hvordan elementer og komponenter er fordelt og dimensjonert. Bootstrap 4 inkluderer en fem-nivå skala for avstandsverktøy, basert på en standardverdivariabel . Velg verdier for alle visningsporter (f.eks. for ), eller velg responsive varianter for å målrette mot spesifikke visningsporter (f.eks. for å starte ved bruddpunktet).padding 1rem$spacer.mr-3margin-right: 1rem.mr-md-3margin-right: 1remmd
Når veksling displayikke er nødvendig, kan du veksle visibilitymellom et element med våre synlighetsverktøy . Usynlige elementer vil fortsatt påvirke layouten på siden, men er visuelt skjult for besøkende.