Bootstrap Grid - Large Devices

Bootstrap cuadrícula Ejemplo: dispositivos de gran tamaño

En el capítulo anterior, presentamos un ejemplo de rejilla con las clases de dispositivos pequeños y medianos. Se han utilizado dos divs (columnas) y les dimos un 25%/75% dividida en dispositivos pequeños, y un 50%/50% dividida en dispositivos medianas:

Pero en los dispositivos grandes del diseño puede ser mejor como un 33%/66% dividido.

Consejo: dispositivos de gran tamaño se definen por tener un ancho de pantalla de 1200 píxeles y superiores.

Para los dispositivos grandes usaremos los .col-lg-* clases.

Así que ahora vamos a añadir los anchos de columna para dispositivos de gran tamaño:

Ahora Bootstrap va a decir "por el pequeño tamaño, mirar a las clases con -sm- en ellos y utilizar esos. En el mediano, mirar a las clases con -md- en ellos y utilizar esos. En el gran tamaño, mira clases con la palabra -lg- en ellos y utilizar los ".

El siguiente ejemplo se traducirá en un 25%/75% dividida en dispositivos pequeños, un 50%/50% dividida en dispositivos medianas, y un 33%/66% dividida en dispositivos grandes:

Usando sólo las grandes

En el siguiente ejemplo, que sólo se especifican los .col-lg-6 clase (sin .col-md-* y / o .col-sm-* ). Esto significa que los dispositivos grandes se dividirán 50% / 50%. Sin embargo, para los dispositivos de medianas y pequeñas, que se acumulará en vertical (ancho 100%):