Contenedores de diseño y sistemas de cuadrícula ráster
? 2. La clase contenedor-fluido se utiliza para contenedores con un ancho de 100 y que ocupan toda la ventana gráfica.
Bootstrap proporciona un sistema de cuadrícula fluida y receptivo para dispositivos móviles que se divide automáticamente en hasta 12 columnas a medida que aumenta el tamaño de la pantalla o la ventana gráfica. Este sistema de cuadrícula crea un diseño de página combinando una serie de filas y columnas, y su contenido se ajusta a estos diseños creados.
? La implementación del sistema grid es muy sencilla. Simplemente define el tamaño del contenedor, divídelo en 12 partes iguales (también se puede dividir en 24 o 32 partes iguales, pero 12 partes iguales es lo máximo). común), y luego ajuste el relleno y los márgenes, y finalmente combínelos con consultas de medios para crear un poderoso sistema de cuadrícula responsivo.
? Nota: El sistema Grid debe usar css
? contenedor, fila, xs (teléfonos xsmall), sm (tableta pequeña sm), md (escritorios intermedios), lg (escritorios grandes). ), a saber: ultrapequeño (automático), pequeño (750 px), mediano (970 px) y grande (1170 px)
¿La fila de datos (.row) debe estar contenida en el contenedor (.container)? Para darle la alineación adecuada y el espaciado interno (relleno).
? Se pueden agregar columnas a las filas, y solo las columnas pueden ser hijas directas del contenedor de filas, pero la suma de las columnas no puede exceder el número total de columnas en el vínculo, por ejemplo, 12. Si es mayor que 12, cambiará automáticamente a la siguiente línea.
? El contenido específico debe colocarse en el contenedor de columnas
#### #### Combinación de columnas
¿La comprensión simple de la combinación de columnas es? para cambiar el número de columnas Para fusionar columnas (el principio es: el número total de columnas no puede exceder 12. Cuando es mayor que 12, cambiará automáticamente a la siguiente fila), que es algo similar a la columna del mesa. Esto es algo similar al atributo colspan de una tabla.
? Si no queremos que dos columnas adyacentes estén muy juntas, pero no queremos utilizar márgenes u otros medios técnicos. Esto se puede lograr utilizando la función de desplazamiento de columna. El uso del desplazamiento de columna también es muy simple. Simplemente agregue el nombre de clase "col-md-offset-*" al elemento de la columna (donde el asterisco representa el número de combinaciones de columnas que se van a compensar), luego la columna con este nombre de clase. se desplazará hacia la derecha. Por ejemplo, si agrega "col-md-offset-8" al elemento de columna, significa que la columna se desplazará hacia la derecha en 8 columnas (asegúrese de que el número total de columnas y columnas desplazadas no exceda 12, de lo contrario la columna se romperá).
La clasificación de columnas en realidad cambia la dirección de la columna, es decir, cambia la flotación izquierda y derecha y establece la distancia de flotación. En el sistema de cuadrícula del marco Bootstrap, esto se puede lograr agregando los nombres de clase col-md-push-* y col-md-pull-* (donde el asterisco representa el número de combinaciones de columnas movidas).
? El sistema de cuadrícula del marco Bootstrap también admite el anidamiento de columnas. Puede agregar uno o más contenedores de filas para una columna y luego insertar columnas dentro de los contenedores de filas.