Maquetado responsive con CSS Grid | Diseño adaptativo

Подписаться 37 тыс.

Просмотров 127 тыс.

50% 1

✅ Contenido:
✔ Maquetación de una página web responsive usando CSS Grid.
✔ Uso de grid-template-columns, grid-template-rows y grid-template-areas.
✔ Uso de la propiedad grid-template y media queries para crear maquetados específicos para cada dispositivo.
A diferencia del CSS flexbox que está diseñado manejar una sola dimensión ya sea horizontal como vertical, CSS Grid nos posibilita diseñar grillas donde podemos manejar tanto las filas como las columnas (2 dimensiones).
📺 Videos relacionados:
Galería de imágenes responsive usando CSS GRID: • Galería de imágenes re...
CSS GRID | Guía completa DESDE CERO: • CSS GRID | Guía comple...
👀 Les sugiero pongan el video en 1080p para que puedan ver el código con nitidez.
👍 Suscríbete al canal y activa la campanita para que no te pierdas ningún video:
ru-vid.com?sub_...
🐤Sígueme en twitter:
/ ymulenll
📌Enlaces:
Código fuente:
github.com/ymulenll/css-grid-...
Muchas gracias por ver este video, espero le haya sido útil.
#css #grid

Опубликовано:

22 май 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 647

@Mtc790 3 года назад

dios mio una vida peleando para que los elementos me tomaran todo el height de la pagina, videos de horas, tutoriales x demás hasta que llegue aca, genial

@apoyoinformaticorp9268 2 года назад

mismo caso jejeje

@leandroacuna5159 2 года назад

LIteralmente sigo sin creer que es real poder hacerlo de esta manera tan facil, videos de HORAS, en serio MUCHAS HORAS y solo renegaba con los width, los height y demas, no se, te amo uwu

@jonathansanso5900 2 года назад

Es increíble como este video supera y arraza a todos los profesores vuelteros y rebuscados que pueden saber mucho y explican para la mismísima miércoles gastando 3 horas para que nadie entienda nada. Por miles de videos como este 🎇🎆🎇🎆

@yamilcrespo2140 2 года назад

@GENIOSDELCODIGO Год назад

@@jonathansanso5900 El desastre es cuando intentas poner cajas de texto etiquetas o usar formularios no pude!!!!!!

@lucasadrianpulido1063 Год назад

Una explicación tan simple, y otros profesores lo explican muy difícil hasta te pierden

@ChristianRamirez-xe8qp 26 дней назад

Excelente aportación, antes era relajo maquetar y ahora con esta herramienta es muy agradable y fácil. Gracias!!!!

@danielcadevilla3558 24 дня назад

Acabo de ver el video..aun no se si estoy dormido o despierto..que barbaro..😊

@federicojordanmuinos 3 года назад

Justo lo que estaba buscando, súper claro explicado y directo al tema. Muchas gracias!

@THECMYKFILTER 2 года назад

Gran trabajo Yoelvis, mil gracias siempre por compartir con nosotros tus contenidos y toda la experiencia de la programacion frontend y backend, saludos!

@bando2994 Год назад

El mejor tutorial de grids que vi, horas viendo videos y aca en 13 minutos lo explico a la perfección.

@misthios9028 2 года назад

Hermano mereces muchos más suscriptores y vistas, realmente enseñás muy bien! es el mejor tutorial de grid que vi y eso que miré cientos

@elenagarciaaubert8078 Год назад

Genialmente explicado y breve, rápido, una maravilla. Enhorabuena

@lukas6185 Год назад

Lo haces ver tan fácil! increíble ♥

@antonioweb4708 2 года назад

Perfecto. A veces no es lo que sabes, sino como explica, lo haces bien y sencillo de entender. Gracias

@eliasolivtradet6627 Год назад

El mejor tutorial que he encontrado, estoy flipando que sea tan simples.... muchas gracias y un feliz año.

@danieltebecheri7690 3 года назад

Muy buen contenido , un verdadero aporte , algo distinto a lo que se muestra habitualmente. Muchas gracias !!

@diegoinaui 2 года назад

Muy bueno, simple y conciso, te felicito por el tutorial.

@deaxxx132 8 месяцев назад

De corazón te agradezco por el tuto rápido y eficiente. Te ganaste un fan/subs. Abrazo desde Argentina.

@gabrielgrg2011 3 года назад

Justo, lo que estaba buscando. Gracias!

@k4rma442 2 года назад

El mejor tutorial de css grid que eh visto, tienes mis respetos.

@matiasandresmayo7756 3 года назад

Maravilloso! Gracias por compartir!!!

@vmponce Год назад

Qué genio! Gracias por el aporte!

@leticiamarianivalera9696 3 года назад

Muy interesante y clara la explicación. Gracias por compartir.

@ArmelPenaRangel 2 года назад

Sencillamente expectacular..!

@fernandorojas4925 Год назад

te haz ganado un suscriptor, excelente forma de explicar el uso de grid

@tionazo Год назад

Explicación super clara, concisa y completa. Muchas gracias!

@pottelois606 3 года назад

Súper genial muy útil, breve y precisa la información.

@vanesanchez5578 Год назад

Transmites mucha alegría por compartir. Motivas mucho.

@mariocalcetin7602 3 года назад

Mas claro imposible , agradecido don Yoelvis.

@distopiamonocronica8768 Год назад

Gracias amigo, este video tiene mucha calidad, y la forma en como lo explicas es demasiado buena, que grande.

@salvadorperez3717 Год назад

Excelente, muy preciso y claro.

@macustore Год назад

wow, wow, wow. Me pase horas intentando maquetar y programar responsive. Solo te tomo 13 minutos. Mis mejores 13 minutos invertidos. Gracias Yoelvis.

@luis01 Год назад

¡INCREIBLE! Un tutorial bastante sencillo y fácil

@Thedragon47 2 года назад

Explicas super genial, te ganaste un suscriptor

@michaelleonel00 Год назад

La facilidad, con la que explicas cada propiedad. Un maestro 🙌

@iEdu12 2 года назад

Que maravilla de video, muy bien explicado, codigo limpio y una excelente calidad.

@lacacode Год назад

Brutal, genial explicación

@juansavid2825 2 года назад

Excelente y muy práctico de implementar - Gracias

@breackersoft8876 3 года назад

Excelente explicación, bastante claro y puntual

@cristianosvaldovallesviza1599 Месяц назад

Excelente tutorial. Muchas gracias

@francogauna6052 3 месяца назад

Excelente. Bastante contenido en poco tiempo.

@crackzz8913 3 года назад

Ufff genial super rápido y puntual. Gracias!

@lander1993 5 месяцев назад

Muchísimas gracias. Se entiende perfecto. Una gran ayuda.

@juliosanchez8349 3 года назад

Lo mejor en css en poquisimo tiempo. Ya me suscribi

@wgarciamail 2 года назад

Bien explicado, directo y sencilo. 👍

@profedavid5846 2 года назад

Excelente video maestro!! Muy claro y efectivo. Muchísimas gracias!!

@LuchoPandiani 7 месяцев назад

muy rapido y simple, te felicito

@ipc1962 2 года назад

Es realmente increíble!!! Muchas gracias!!!!

@jorgeasanchezp 3 года назад

Excelente! Fácil de entender y aplicar

@angelfedericoortiz1731 7 месяцев назад

Te pasaste con los tutoriales de css grid y flexbox, muy bueno.👏

@The1979auri 2 года назад

Gracias por compartir tu conocimiento, te he descubierto en este video y ya estoy suscrita, increíble lo fácil que explicas Css Grid, me encanta como lo has explicado. Gracias de nuevo! Un saludo desde Sevilla.

@jc3038 3 года назад

Excelentísima explicación! Concreta y pedagógica. Suscrito

@lautaroexequielfernandez5427 3 года назад

El mejor tutorial de grid. Felicitaciones!

@profesoredwin 2 года назад

Muchas gracias por tan importante aporte

@EliasAndresRD Год назад

que pedazo de tutorial!!!! gracias!!!

@jangelGuerrero 3 года назад

Excelente información Yoelvis, muchas gracias.

@albinacruzbrizuela5911 3 года назад

Me acabas de salvar la vida!!! Mil gracias!! Mil likes!!!

@diegoalejandrogarciaguayar6493 2 года назад

Gracias por el aporte y por el tiempo me ha servido muchísimo.

@cristian_brandan Год назад

Muy buen recurso y muy bien explicado. Gracias

@Denis-db1fg Год назад

madre mía eres la caña, te quiero 😭❤

@elganstergamer839 2 года назад

Se nota la experiencia, gracias por compartir tus conocimientos

@CesarTornelConsultoria 2 года назад

El mejor tutoría de css gris responsive, fácil, rápido y al tema, sigue así :p

@josegregoriogarcia5427 Год назад

De todos los videos que e visto, Tu explicas de una manera super clara y concisa sin dar muchas vueltas al asunto! Magnifico de verdad!

@GonzaloNahuelGramajo Год назад

Era hacer un vídeo bro, no el mejor tutorial de la vida 🤯❤. MUCHAS GRACIAS, hiciste verlo como un juego

@YoelvisM Год назад

jaja muchas gracias por el comentario

@Polybiusly Год назад

Wow! acabas de abrir un nuevo mundo para mi!! eres muy bueno explicando, gracias por tu contenido!

@sebastianlanzetti Год назад

Por FA VOR, buenísimo el video la verdad, 100/10. Felicidades por hacer un maquetado tan pero tan simple.

@user-mj3tt7er8q 7 месяцев назад

el mejor tutorial que he visto, muchas gracias

@LuisEnrique-cy8xw 2 года назад

simplemente, el mejor video. gracias me ayudo mucho

@CALIBARG Год назад

Muchas gracias por el aporte y la explicacion tan clara.

@richardguach5869 2 года назад

De tantos tutoriales que había visto, este fue el único que me ayudó, fácil, rápido, y al grano. Muchas gracias por compartir tu conocimiento. Nuevo suscriptor :D.

@LeoNadalez Год назад

muy bien explicado y tan sencillo, gracias !!!

@luks96prod 2 года назад

Estoy arrancando con esto del diseño web y la verdad un gusto encontrar este video! Es justo lo que necesitaba y lo explicas de una manera super sencilla. La verdad, un crack!

@eduardorivas6959 2 года назад

Fantastico! Muchas gracias.

@jeanluiguipierre Год назад

Eres un crack men, explicas muy bien.

@nelsonrojs2515 3 года назад

Hasta ahora este es el mejor tutorial que veo relacionado con CSS Grid 👍👍👍

@adrenocromox 2 года назад

Muy buen tutorial, muy clara la información y la locución prolija. Me gusto el estilo, bien académico.

@jormanurbina675 Год назад

Muy bueno y bien explicado, muchas gracias.

@edgarveliz8149 Год назад

Excelente tutorial, ya me suscribo a tu canal.

@juliancho814 2 года назад

Maravillosa explicación

@franklinhurtado5784 8 месяцев назад

Gracias, llevo tiempo buscando este contenido.

@josecalix Год назад

El vídeo más preciso y consiso. 👏🏽

@sebastianrobayna6699 Год назад

Muchas gracias, muy clara la explicación!!!

@kestradalp 2 года назад

Amigo, eres genial. Muchas gracias.

@agustinsch 8 месяцев назад

nonoo, sos dios amigooo, explicas como el puto amo broderrrr

@Street.Melody 2 года назад

Compañero te ganaste un nuevo subscriptor!! Mil millones de gracias brotherrrr. new sub, new like. Saludos desdeUruguay!!

@genlaelocuencia 3 года назад

Excelente!!! muchas gracias por este gran video

@williamwildo 2 года назад

Muchas gracias por esto, en realidad ayudas mucho. Un gran abrazo

@austinmoquillazajayo8968 Год назад

TNice tutorials is actually a very good and straight forward tutorial. No having ask questions or guess, no over-explaining elents, and brings

@diegoalejodiazp182 3 года назад

La mejor explicación que he visto definitivamente, gracias por tu tiempo para enseñar. Saludos!!

@YoelvisM 3 года назад

Muchas gracias

@davidemersonperalesvillanu70 3 года назад

la verdad

@robertobaldizon8206 2 года назад

Muchas gracias. El mejor tutorial sobre el tema. Saludos.

@fernandoortiz4775 3 года назад

Excelente, Maestro.

@pepinogdev 3 года назад

Muy bien explicado, se entiende bien y me gusta que hayas explicado lo de grid-template con las medidas row y colum incluidas, es la primera vez que lo veo en varios tutoriales, un saludo!

@Capocomico Год назад

por fin encuentro esto, todos empiezan por las cortinas y los cuadros antes de comenzar por el techo y las paredes

@elrhan 3 года назад

Muy buen tutorial, felicidades y gracias!

@LuisVideoXHD 3 года назад

Exelente video ,queria comenzar a agregar grid a mis desarrollos web y se ve genial la herramienta

@ezequielvera9841 2 года назад

El mejor video de Grid que vi hasta ahora! muchas gracias

@ivanovichenco 2 года назад

Gracias amigo por esta manera tan sencilla de entregar este tutorial tan grandioso. Me sacó de un apuro muy grande. Que Dios lo bendiga.

@alicbarandicamejia5626 Год назад

De esta forma lo veo tan, pero tan sencillo que casi no me lo creo, muchas gracias por el contenido, me ha sido de mucha ayuda

@session182 Год назад

la verdad que mas claro imposible!!!!!! excelente, muchas gracias

@yuriyaranga6688 4 месяца назад

Super Genial. Fue pragmático, en un lenguaje limpio y entendible.

@MoisesMiguelCasas 13 дней назад

Perfecto, muchas gracias por compartir tus conocimientos, estoy retomando la programación y este video si que motiva, muy sencillo practico y explicado. Gracias por el aporte.