Terrain de jeu Grille Bootstrap
Composez visuellement des mises en page responsives avec la grille Bootstrap 5.3 et copiez les classes exactes — row, col, décalages, ordre, gouttières et alignement.
—
Tout s’exécute dans votre navigateur — rien n’est envoyé.
Les classes définies s’appliquent à partir de ce point de rupture et au-delà. Changez de point de rupture pour créer des mises en page responsives.
À propos de Terrain de jeu Grille Bootstrap
Le Bac à Sable Bootstrap Grid construit des dispositions réactives en lignes et colonnes avec le véritable système de grille Bootstrap 5.3. Ajoutez jusqu'à 12 colonnes à une ligne, cliquez sur n'importe quelle colonne pour définir sa largeur, son décalage et son ordre, et ajustez les gouttières et l'alignement sur la ligne — l'aperçu et le balisage généré se mettent à jour en direct à chaque changement.
Parce que les grilles Bootstrap sont mobile-first, le sélecteur de points de rupture est central : définissez une colonne sur col-6 à la base et col-md-4 à md, et vous avez construit le motif classique empilé sur mobile, trois côte à côte sur desktop, sans écrire une seule ligne de code. Les décalages, l'ordre et les classes de gouttière prennent tous les mêmes suffixes responsives.
Le résultat est du HTML propre à copier-coller — une div de ligne avec ses colonnes enfants et exactement les classes que vous avez configurées. Copiez l'extrait entier ou juste les classes de la ligne ; tout fonctionne localement dans votre navigateur.
Comment utiliser Terrain de jeu Grille Bootstrap
- Ajoutez des colonnes à la ligne — jusqu'à 12 — et cliquez sur l'une d'elles pour la sélectionner.
- Définissez l'étendue, le décalage et l'ordre de la colonne sélectionnée pour le point de rupture actuel.
- Changez de point de rupture (sm à xxl) pour définir comment la disposition se réorganise sur les écrans plus grands.
- Ajustez les gouttières de la ligne et ses utilitaires d'alignement.
- Vérifiez l'aperçu en direct, puis copiez le HTML généré ou les classes de la ligne.