Un Grid System trae 12 columnas y es como divides la posición de las etiquetas contenedoras entre cuantas columnas tenemos que utilizar para maquetar un diseño y luego poder reposicionar todos los elementos al momento de que estemos trabajando de forma responsive.
Introducción a Materialize
Frameworks ¿Qué son?
¿Qué es Material Design y Materialize?
La lógica detrás del Grid system
Documentación y características de Materialize
Componentes de Materialize
Desarrollo del sitio
Presentación del proyecto
Instalación del proyecto
Elaboración del header
Estilos al header
Construcción del main homepage
Finalizando cards en el homepage
Terminando el index.html y estilos en el mainpage
Desarrollo de la página de artículo
Desarrollo del formulario de registro
Desarrollo de checkboxes en el formulario
Despliege del proyecto
Despliegue del proyecto en Firebase
Conclusiones
Crea una cuenta o inicia sesión
¡Continúa aprendiendo sin ningún costo! Únete y comienza a potenciar tu carrera
Convierte tus certificados en títulos universitarios en USA
Antes: $249
$209
Paga en 4 cuotas sin intereses
Termina en:
17 Días
11 Hrs
35 Min
58 Seg
La lógica detrás del Grid system
3/17Recursos
Aportes 18
Preguntas 1
Ordenar por:
Me gusta mucho porque es como CSS Grid
Entonces sigue el mismo patrón que CSS Grid?
NC - slide - Documentación y características de materialize.
Es el concepto de columnas que utilizamos al generar diseño.
Un Grid System contiene 12 columnas. Y nos sirve para posicionar las Etiquetas Contenedoras para maquetar y Reposicionar todos los elementos cuando trabajamos Responsive.
El Grid system se divide en 12 columnas, en el grid se pueden crear areas o o etiquetas contenedoras como el Header, el Nav, el Content o el Footer.
el sistema de grillas tiene 12 columnas en total, la disposición de estas depende del diseño y ayuda mucho en el responsive design.
<h4>La lógica detrás del Grid system</h4>
Es el sistema de 12 columnas. Sabremos cuál es el espacio que usarán las etiquetas contenedoras. Esto nos ayuda mucho en el diseño responsive.
Materialize CSS utiliza el formato de cuadrícula de 12 columnas de Bootstrap para que pueda crear rápidamente diseños de página receptivos. Comenzará aún más rápido con los conocimientos básicos de un proyecto Bootstrap.
Más características de Materialize CSS:
- Menús móviles
- Compatible con Sass
Material tiene mejor estilos que Boostrap
la clase .row no permite generar un contenedor de filas chicos téngalo presente
He visto este concepto en varios Frameworks así mismo veo como algunas personas discuten sobre si es mejor usarlo natural con CSS grid o con estas ayudas.
.
Pienso que es fundamental conocer la naturaleza de donde proviene que es CSS grid y luego si deseas puedes tomar el camino que quieras ya sabiendo como es que realmente funciona todo.
El sistema de grilla es una de las principales razones por las cuales se utiliza un framework, ya que esa funcionalidad permite ahorrar mucho tiempo al momento de maquetar/diseñar/plasmar
Esto vendría a ser grid-areas en CSS Grid, y también es muy parecido a Bootstrap, me gusta!
Muchas gracias Diego.
Clase interesante!
Me gusta porque seguire practicando Grid Css 😀
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?