Utilitaires de mise en page
Pour un développement plus rapide et réactif, Bootstrap comprend des dizaines de classes utilitaires pour afficher, masquer, aligner et espacer le contenu.
Utilisez nos utilitaires d'affichage pour basculer de manière réactive les valeurs communes de la displaypropriété. Mélangez-le avec notre système de grille, notre contenu ou nos composants pour les afficher ou les masquer dans des fenêtres spécifiques.
Bootstrap 4 est construit avec flexbox, mais tous les éléments n'ont pas displayété modifiés display: flexcar cela ajouterait de nombreux remplacements inutiles et modifierait de manière inattendue les comportements clés du navigateur. La plupart de nos composants sont construits avec flexbox activé.
Si vous avez besoin d'ajouter display: flexun élément, faites-le avec .d-flexou l'une des variantes réactives (par exemple, .d-sm-flex). Vous aurez besoin de cette classe ou de cette displayvaleur pour permettre l'utilisation de nos utilitaires flexbox supplémentaires pour le dimensionnement, l'alignement, l'espacement, etc.
Utilisez les utilitaires d'espacementmargin et pour contrôler l'espacement et la taille des éléments et des composants. Bootstrap 4 inclut une échelle à cinq niveaux pour les utilitaires d'espacement, basée sur une variable de valeur par défaut . Choisissez des valeurs pour toutes les fenêtres (par exemple, pour ), ou choisissez des variantes réactives pour cibler des fenêtres spécifiques (par exemple, pour commencer au point d' arrêt).padding 1rem$spacer.mr-3margin-right: 1rem.mr-md-3margin-right: 1remmd
Lorsque le basculement displayn'est pas nécessaire, vous pouvez basculer visibilityd'un élément à l'aide de nos utilitaires de visibilité . Les éléments invisibles affecteront toujours la mise en page de la page, mais sont visuellement cachés aux visiteurs.