Bootstrap Grid - Large Devices

Bootstrap Grille Exemple: Grandes Devices

Dans le chapitre précédent, nous avons présenté un exemple de grille avec des classes pour les petites et moyennes appareils. Nous avons utilisé deux divs (colonnes) et nous leur avons donné un 25%/75% divisée sur les petits appareils, et un 50%/50% divisée sur les appareils moyenne:

Mais sur de grands dispositifs de la conception peut - être mieux comme un 33%/66% divisé.

Astuce: Les grands dispositifs sont définis comme ayant une largeur d'écran de 1200 pixels et plus.

Pour les grands appareils , nous allons utiliser les .col-lg-* classes.

Alors maintenant, nous allons ajouter la largeur des colonnes pour les grands dispositifs:

Maintenant Bootstrap va dire "à la petite taille, regardez les classes avec -sm- en eux et utiliser ceux -ci . A la taille moyenne, regardez les classes avec -md- en eux et utiliser ceux -ci . A la grande taille, regardez classes avec le mot -lg- en eux et utiliser ces ".

L'exemple suivant se traduira par un 25%/75% divisée sur les petits appareils, un 50%/50% divisée sur les appareils moyens, et un 33%/66% divisée sur de grands dispositifs:

Utilisation Seulement Grand

Dans l'exemple ci - dessous, nous indiquons seulement le .col-lg-6 classe (sans .col-md-* et / ou .col-sm-* ). Cela signifie que les grands appareils se partageront 50% / 50%. Cependant, pour les appareils de petites et moyennes, il empiler verticalement (largeur de 100%):