Diseños de cuadrícula básicos para que se familiarice con la construcción dentro del sistema de cuadrícula Bootstrap.
En estos ejemplos, la .themed-grid-colclase se agrega a las columnas para agregar algo de tematización. Esta no es una clase que esté disponible en Bootstrap de forma predeterminada.
Hay cinco niveles en el sistema de cuadrícula Bootstrap, uno para cada rango de dispositivos que admitimos. Cada nivel comienza con un tamaño mínimo de ventana gráfica y se aplica automáticamente a los dispositivos más grandes, a menos que se anule.
Obtenga tres columnas de igual ancho comenzando en los escritorios y escalando a escritorios grandes . En dispositivos móviles, tabletas e inferiores, las columnas se apilarán automáticamente.
Obtenga tres columnas comenzando en los escritorios y escalando a escritorios grandes de varios anchos. Recuerde, las columnas de la cuadrícula deben sumar doce para un solo bloque horizontal. Más que eso, y las columnas comienzan a apilarse sin importar la ventana gráfica.
Obtenga dos columnas comenzando en los escritorios y escalando a escritorios grandes .
No se necesitan clases de cuadrícula para elementos de ancho completo.
Según la documentación, anidar es fácil: simplemente coloque una fila de columnas dentro de una columna existente. Esto le brinda dos columnas que comienzan en los escritorios y se escalan a escritorios grandes , con otras dos (anchos iguales) dentro de la columna más grande.
En tamaños de dispositivos móviles, tabletas y menos, estas columnas y sus columnas anidadas se apilarán.
El sistema de cuadrícula Bootstrap v4 tiene cinco niveles de clases: xs (extra pequeño), sm (pequeño), md (mediano), lg (grande) y xl (extra grande). Puede usar casi cualquier combinación de estas clases para crear diseños más dinámicos y flexibles.
Cada nivel de clases se amplía, lo que significa que si planea establecer los mismos anchos para xs y sm, solo necesita especificar xs.