En esta ocasión, creamos un proyecto utilizando CSS Grid para la estructura de columnas y filas de nuestro header y Flex para ajustar el contenido a cada celda de nuestro contenedor Grid. También vimos cómo podemos modificar el Grid con media queries para diferentes tamaños de pantalla.

Este es el resumen del proyecto:

* Utilizamos HTML5 + CSS3.

* Utilizamos CSS Grid y Flex para crear la estructura y ajustes de contenido.

* Adaptamos nuestro layout para hacerlo 100% responsive, es decir, adaptado a cualquier tamaño de pantalla.

Tengo otra publicación con más detalles de CSS Grid, puedes verla en la siguiente dirección: CSS Grid Layout – Primeros Pasos

Puedes ver un video que preparé con algunos ejemplos útiles para comenzar hoy mismo a utilizar Grid en tu proyecto.

https://youtu.be/fefCiH1VL9E

Suscríbete a nuestro canal en Youtube y dale click a la campanita para recibir notificaciones cuando tengamos nuevo contenido útil para mejorar tus habilidades como desarrollador Front-end. Recuerda que siempre hay algo nuevo por aprender. Para suscribirte puedes utilizar el siguiente enlace:  Canal en Youtube

[contact-form-7 id=»13133″ title=»MeetupStyleLeading5″]

Te cuento que puedes unirte a nuestro grupo de Meetup styleLeading donde hacemos proyectos en vivo y conversamos sobre diseño y desarrollo de sitios web: https://www.meetup.com/es/STYLE-LEADING/

Puedes utilizar el siguiente formulario para recibir en tu correo electrónico el proyecto con los archivos HTML y CSS, y así poder realizar las modificaciones que necesites y así mejorar el proyecto. 

No olvides visitar nuestro BLOG para ver más contenido interesante y también otros proyectos con los archivos HTML y CSS, y así poder realizar las modificaciones que necesites.

Me despido como siempre, deseándote los mejor en tus proyectos.

Publicado por Jair Poveda

Software Engineer and Entrepreneur. Founder - CEO of @Cooltimedia

Dejar un comentario