Como hacer un Footer Responsive - Html y Css

แชร์
ฝัง
  • เผยแพร่เมื่อ 25 ม.ค. 2025

ความคิดเห็น • 127

  • @SLeeDw
    @SLeeDw  3 ปีที่แล้ว +10

    Suscríbete ✅ para más vídeos tutoriales de proyectos web 💻
    :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
    🌐 Visita mi sitio web para más recursos 👇🏻:
    - bit.ly/sleedw
    📱 Únete a nuestra comunidad en WhatsApp y comparte tus proyectos o dudas que tengas 👇🏻:
    - bit.ly/sleedw-grupo-whatsapp
    🔵 Síguenos en Facebook 👇🏻:
    - bit.ly/face-oficial-sleedw
    ▶ Saludos y que Dios te bendiga. 🙌

    • @dianaflores7099
      @dianaflores7099 2 ปีที่แล้ว

      Hola tengo un problema cuando ingreso este código "grid-template-columns: repeat(3, 1fr);" me sale "Expected RBRACE at line 212, col 35" Espero puedas ayudarme
      207 .pie-pagina .grupo-1{
      208 width: 100%;
      209 max-width: 1200px;
      210 margin:auto;
      211 display: grid;
      212 grid-template-columns: repeat(3, 1fr);
      213 grid-gap: 50px;
      214 padding: 45px 0px;
      215 }

    • @OmAnuX
      @OmAnuX ปีที่แล้ว

      Hola tengo una duda,¿como hago par centrar los iconos de las redes sociales?

  • @bryanalexanderrianoromero530
    @bryanalexanderrianoromero530 10 หลายเดือนก่อน +3

    bro al fin alguien que explica como se logra hacer responsive, like y suscrito, me salvaste

    • @SLeeDw
      @SLeeDw  10 หลายเดือนก่อน

      Muchas gracias. Saludos

  • @undiadepaz
    @undiadepaz 2 ปีที่แล้ว +4

    el ÚNICO video tutorial que seguí el paso a paso y me quedó espectacular. Mil gracias, amigo!!!

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว +1

      Muchas gracias por su comentario. Saludos y Bendiciones. 💻🙌

  • @deilyurbano3101
    @deilyurbano3101 2 ปีที่แล้ว +4

    Excelente explicación, estoy explorando este nuevo mundo y de verdad, explicarte todo a la perfección. Sigan publicando videos así.. Dios los bendiga

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว +1

      Muchas gracias. Seguiremos creando más contenido. Saludos 🙌

  • @claudiosepulveda9310
    @claudiosepulveda9310 2 ปีที่แล้ว +3

    Muchas, muchas gracias amigo! Aprendí muchísimo amigo y me salvaste la vida con una tarea de desarrollo web. Eres el mejor!

  • @CarlosKesqui
    @CarlosKesqui 2 ปีที่แล้ว

    ¡Gracias!

  • @michellevielma1183
    @michellevielma1183 2 หลายเดือนก่อน

    Gracias me funciono, justo buscaba uno que tuviera sea responsive

  • @MrLeopg
    @MrLeopg 2 หลายเดือนก่อน +1

    muy bueno, ya utilizado ajustando mis cosas. Gracias

  • @JeanSantos-by3oi
    @JeanSantos-by3oi 3 ปีที่แล้ว +8

    Gracias por todo bro, me ayudaste a conocer este editor de código que es más fácil de utilizar (usaba el blog de notas XD y también en hacer el footer.

    • @SLeeDw
      @SLeeDw  3 ปีที่แล้ว +1

      Hola, muchas gracias por tu comentario.. Me alegra mucho a verte ayudado. Saludos y Dios te bendiga 🙌💻

    • @Junior-jt1nk
      @Junior-jt1nk 2 ปีที่แล้ว +3

      No mames jajajaj eres un DIOS ALV

  • @luisalbertoortega229
    @luisalbertoortega229 2 ปีที่แล้ว +3

    HOLA MUCHAS GRACIAS POR TU APORTE ME SIRVIO MUCHO REALMENTE , Te dejo un gran abrazo

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว

      Muchas gracias por el apoyo, saludos y bendiciones.

  • @enyeon
    @enyeon 2 ปีที่แล้ว +1

    Espectacular. Decir que eres un genio queda corto. Muchas gracias por tu ayuda.

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว +1

      Muchas gracias, saludos y bendiciones.

  • @jairocolon339
    @jairocolon339 2 ปีที่แล้ว +1

    Buenisimo borther, saludos desde Colombia.

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว +1

      Muchas gracias, saludos desde Perú.

  • @dizayn_emprendimiento6929
    @dizayn_emprendimiento6929 3 ปีที่แล้ว +4

    Me encantan todos tus videooos 👏🙌

    • @SLeeDw
      @SLeeDw  3 ปีที่แล้ว +1

      Muchas gracias, Somos un gran equipo 🙌💻

    • @dizayn_emprendimiento6929
      @dizayn_emprendimiento6929 3 ปีที่แล้ว

      @@SLeeDw de hecho que si 🙌

  • @cristiancontreras2387
    @cristiancontreras2387 3 ปีที่แล้ว +2

    Mas personas asi como tu !!!! video preciso y consiso

  • @RootDesktopUser
    @RootDesktopUser 2 ปีที่แล้ว +2

    Gracias hermano , excelente aporte de conocimiento

  • @gabrielvillegas5181
    @gabrielvillegas5181 ปีที่แล้ว +1

    Gracias amigo aprendi mucho

  • @destradar1
    @destradar1 2 ปีที่แล้ว +2

    Gracias amigo me fue de gran ayuda tu video. Bendiciones.

  • @playfastordie8528
    @playfastordie8528 ปีที่แล้ว

    excelente maestro, me quedó re facha 😎

  • @Lee_Amichi612
    @Lee_Amichi612 3 หลายเดือนก่อน +1

    maravilloso!!! muchas gracias 💮. Pido permiso para usar tu video y poder crear el mío que es parte de una exposición para la escuela:)) se publica en TH-cam también, así que daré créditos correspondientes💓.

    • @SLeeDw
      @SLeeDw  3 หลายเดือนก่อน

      @@Lee_Amichi612 Claro que sí, no hay problema, suerte en tu proyecto. Saludos cordiales

  • @samuelcardenas1717
    @samuelcardenas1717 ปีที่แล้ว +5

    Muy buen video . Tengo una duda como hacer que todo lo explicado aparezca en la parte de abajo de la página

    • @charlygarcia8258
      @charlygarcia8258 ปีที่แล้ว

      A qué te refieres amigo?

    • @drose42
      @drose42 ปีที่แล้ว

      Me rei jaja solo debes hacerlo dentro del < footer>

  • @jonathanarisaca2382
    @jonathanarisaca2382 ปีที่แล้ว +2

    me funciono todo bien pero sabes como puedo cambiar los iconos de las redes sociales por ejemplo quiero poner discord y tambien quiero poner tiktok pero cuando lo escribo no me sale el icono

  • @angiegarces5271
    @angiegarces5271 ปีที่แล้ว +1

    Muchas gracias, me salvaste la materia.

  • @yurimamora7934
    @yurimamora7934 ปีที่แล้ว +1

    excelente video, muchísimas gracias!!

  • @pauudelfi
    @pauudelfi 3 หลายเดือนก่อน

    Un genioooo, muchas gracias!!

    • @SLeeDw
      @SLeeDw  3 หลายเดือนก่อน

      @@pauudelfi Gracias por tu comentario. Saludos

  • @jeanfrancoromerocalvo5207
    @jeanfrancoromerocalvo5207 2 ปีที่แล้ว +1

    Muy buen video y preciso. genial!! me suscribo

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว

      Muchas gracias. Saludos y Bendiciones 🙌💻

  • @djpetro8428
    @djpetro8428 2 ปีที่แล้ว +1

    INCREIBLE HERMANO, MUCHAS GRACIAS

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว +1

      Muchas gracias por tu comentario. Saludos 🙌💻

  • @loliguerrero
    @loliguerrero ปีที่แล้ว

    Muy buen vídeo! Me has ayudado mucho💜

  • @edgardodeogueta5296
    @edgardodeogueta5296 2 ปีที่แล้ว +1

    Muy bueno, muchas gracias por el aporte y por cierto, ¿cuál es la banda musical, está muy buena? 😉

  • @DejayRusher1
    @DejayRusher1 ปีที่แล้ว

    que hace en sí? muy buen video

  • @reciboscasa6650
    @reciboscasa6650 2 ปีที่แล้ว +1

    Hola!! Muy interesante tu videos, y bien explicado. Al principio no me salia los logos de redes sociales, y volví a pegar toda la ruta y va genial.
    Pero al momento de dar CSS no se genera ningún cambio, por más que verifique que estén igual las rutas😭😭😭😭😭

  • @elmeromex4880
    @elmeromex4880 2 ปีที่แล้ว +6

    Hola bro.
    Tengo un problema.
    No me deja hacer los íconos de las redes sociales. Y hago todo bien, ¿Porqué será?

    • @DanielLopez-lz3ij
      @DanielLopez-lz3ij 9 หลายเดือนก่อน

      Ya sabes cómo ponerlo bro?
      Es que lo necesito urgente 😭

    • @elmeromex4880
      @elmeromex4880 9 หลายเดือนก่อน +2

      @@DanielLopez-lz3ij Hola nop, no pude. Al final tuve que ocupar otro modelo para el Footer.

    • @DanielLopez-lz3ij
      @DanielLopez-lz3ij 8 หลายเดือนก่อน

      @@elmeromex4880 bueno😥, gracias bro

  • @angelgonzalez608
    @angelgonzalez608 ปีที่แล้ว

    hermoso video y tutorial, muchas gracias!!

  • @rafaelmaissel5214
    @rafaelmaissel5214 ปีที่แล้ว

    Hola amigo para usar el font awesome tenes que estar registrado?

  • @jonathanacuna8463
    @jonathanacuna8463 ปีที่แล้ว +2

    hola hermano excelente video consulta no entendi como agregaste los iconos gracias

  • @ramirorosel6439
    @ramirorosel6439 2 ปีที่แล้ว +1

    Los iconos no me salen, que debo hacer en caso de que no encuentre solución?

  • @nelsondavidmelomadronero5891
    @nelsondavidmelomadronero5891 2 ปีที่แล้ว +1

    Muy util y muchas gracias por compartir el code

  • @kur0numartP1
    @kur0numartP1 2 ปีที่แล้ว

    Muchísimas gracias bro, increíble video

  • @facundoaguirre9449
    @facundoaguirre9449 2 ปีที่แล้ว +1

    excelente! consulta! como hago para que cuando se haga click en los iconos de las redes sociales me ridirija a las mismas debido a que en todos los href está el numeral o hash """#"""" ??????? gracias!!

  • @jonavanwinter4447
    @jonavanwinter4447 ปีที่แล้ว +1

    Hola amigo buen dia, muy buen tutorial, pero tengo problemas con el responsive. Apliqué todo lo que indicas pero aun así, mi trabajo no se adapta a pantallas y se desordena por completo. Qué podría ser el problema? :(, saludosss

  • @cesaretniez
    @cesaretniez ปีที่แล้ว

    gracias muñeca¡¡¡ good job :)

  • @a-a2262
    @a-a2262 ปีที่แล้ว

    mano, de que tamaño tiene el logo original? yo le hice uno de 500x500 y no se alinea en el centro, que estoy haciendo mal

  • @robotvivo5158
    @robotvivo5158 ปีที่แล้ว +1

    Gracias bro.

  • @isaac9208
    @isaac9208 2 ปีที่แล้ว +1

    Tysm, did everything as described

  • @luisalvarado4487
    @luisalvarado4487 ปีที่แล้ว

    bro tengo mi encabezado, pero se me esta enlazando con mi footer, como le hago que se vaya a la parte de abajo?

  • @bkt933
    @bkt933 2 ปีที่แล้ว +1

    Tengo un problema y es que me queda código por encima del footer. No me queda al fondo de la página. Que puede ser?

    • @bkt933
      @bkt933 2 ปีที่แล้ว +1

      ya lo solucioné. Tenía mal configurado el VH del body. Buen video!

  • @destradar1
    @destradar1 2 ปีที่แล้ว +1

    Hola amigo te cuento que vi tu video ayer e hice el código tal cual. Cuando cargaba el pie de página salían los íconos de las redes sociales pero hoy que abro nuevamente el index.html ya no aparecen los íconos. Qué habrá pasado?

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว

      Hola, muchas gracias por tu comentario. Respecto a tu pregunta. Puede ser que al momento que has abierto nuevamente el index.html no tenias el Internet. Ya que la vinculación es un enlace que debe tener internet para que se puedan mostrar los iconos. Saludos y Bendiciones 💻🙌

    • @joseleonardoparracabrices616
      @joseleonardoparracabrices616 2 ปีที่แล้ว +1

      @@SLeeDw Buenas amigo!! Tengo el mismo inconveniente que Dante. He comprobado cada uno de las opciones que has planteado, y el problema persiste. No ubico los iconos al momento de plasmarlo en el footer del proyecto.

    • @reciboscasa6650
      @reciboscasa6650 2 ปีที่แล้ว +1

      @@joseleonardoparracabrices616 yo también ingresé igual, tengo internet y no me cargaron los logos de las redes sociales😓

  • @jesus.a.h1923
    @jesus.a.h1923 2 ปีที่แล้ว +2

    Gracias crack me gusto mas tu footer que el que estaba haciendo yo xD

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว

      Hola, Muchas gracias por tu comentario. Saludos y bendiciones 🙌

  • @sm4sh781
    @sm4sh781 2 ปีที่แล้ว

    excelente video! muy buena explicación, lo unico que no me anduvo es el hover, ¿que problema podría estar teniendo? uso sublime text

  • @gatovsky
    @gatovsky 2 ปีที่แล้ว +1

    gracias, me ayudaste :3

  • @soleyo2568
    @soleyo2568 8 หลายเดือนก่อน

    Hola, la pagina cambio donde sacar los iconos y no figura para copiar. Ayuda bastante tu video

  • @carkosPGO
    @carkosPGO 3 ปีที่แล้ว

    tengo una duda como se haria si tuviera que dividirlo con una franja cada seccion???

  • @crisrosinber26
    @crisrosinber26 3 ปีที่แล้ว +1

    Como puedo hacer que solo me quede el diseñi como footer abajo. Y no tener un contenedor blanco abajo .gracias

    • @juancodev
      @juancodev 3 ปีที่แล้ว

      Si bien entiendo tu pregunta: utiliza un height: auto; Y él se adapta al alto según sus hijos dentro. ¡Saludos!

  • @EleazarRosario
    @EleazarRosario 3 ปีที่แล้ว +1

    bro tengo un problema queda muy pegado de unas card que tengo como puedo hacer para que no este pegado

    • @SLeeDw
      @SLeeDw  3 ปีที่แล้ว

      Hola, muchas gracias por tu comentario. Respecto a tu pregunta..puede agregar un margin-top:40px; o más al footer en la hoja de css. Saludos y Dios te bendiga 🙌💻

  • @vm_zambrano
    @vm_zambrano ปีที่แล้ว

    como puedo poner en blogger ??

  • @spokendemon5695
    @spokendemon5695 2 ปีที่แล้ว +1

    Tengo un problema, y es que no me aparecen los íconos de face, ig, twt y yt

    • @nataly3334
      @nataly3334 6 หลายเดือนก่อน

      a mi tampocooooooo

  • @friedrichvillegasmurillo9775
    @friedrichvillegasmurillo9775 2 ปีที่แล้ว +1

    Nice, solo vine por el fontawesome y me quede a ver como haces un footer XD

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว

      Muchas gracias por tu comentario. Saludos y bendiciones 🙌🙌

  • @juanadelossantos5671
    @juanadelossantos5671 3 ปีที่แล้ว +2

    EXCELENTE VIDEO!

    • @SLeeDw
      @SLeeDw  3 ปีที่แล้ว +1

      Muchas gracias por tu comentario, Saludos y Éxitos 🙌💻

  • @gaelromerovazquez9781
    @gaelromerovazquez9781 ปีที่แล้ว

    Hola amigo, perdón una duda, me quedo como te salió a ti, pero quería preguntarte si la línea de meta name=“viewport” es obligatoria y de ser así, puedes proporcionarme la es que no se ve completa 😔

  • @Lusaa
    @Lusaa 2 หลายเดือนก่อน +1

    no me deja hacer la abreviacion tipo .box*3 porque pasa eso xd, gracias por el turorial

    • @SLeeDw
      @SLeeDw  2 หลายเดือนก่อน

      @@Lusaa que editor de código utilizas?

  •  3 ปีที่แล้ว +1

    Hola! gracias por el video, como hago para que el footer me quede pegado abajo?

    • @SLeeDw
      @SLeeDw  3 ปีที่แล้ว +2

      Hola, muchas gracias por tu comentario. Respecto a tu pregunta. El footer (pie de página) se posiciona sólo, siempre y cuando tenga contenido en la parte de arriba.. también de puedes agregarle un margen superior en CSS, que es la propiedad "margin-top:40px;" al contenerdo footer. Saludos y Bendiciones 💻🙌

    •  3 ปีที่แล้ว

      @@SLeeDw muchas gracias, lo intentaré!

  • @jorgesierra8891
    @jorgesierra8891 3 ปีที่แล้ว +1

    Buenas, no me funciona el fa fa-Facebook y de ninguna red social, uso visual studio code.

    • @SLeeDw
      @SLeeDw  3 ปีที่แล้ว

      Hola, muchas gracias por tu comentario, respecto a tu problema con los iconos, debe ser por 3 factores importantes:
      1. Que no tengas vinculado correctamente el fontwase, que debe estar dentro de la etiqueta
      2. Si tienes vinculado correctamente el link de fontwase, debes asegurarte de tener internet para que se muestren los iconos en la página.
      3. Si está vinculado fontwase, tienes Internet, ahora debes asegurarte que la sintaxis "fa fa-facebook" esté correctamente escrito.
      Saludos y Bendiciones. 🙌💻
      (Si aún persiste el problema te invito a que te unas a nuestro grupo de whatsapp o que nos escribas a nuestra página de facebook).

  • @zMathwz15
    @zMathwz15 2 ปีที่แล้ว

    Muito bom, vou atualizar. Very good. I will update.

  • @carlosemilianodelacruzdiaz2131
    @carlosemilianodelacruzdiaz2131 ปีที่แล้ว

    Y que hago si no me manda a ningún lado cuando doy click?

  • @Trofius_016_YT
    @Trofius_016_YT 2 ปีที่แล้ว +1

    No me salen los logos :c que hago?

  • @florenciaretamozo6115
    @florenciaretamozo6115 2 ปีที่แล้ว +1

    graciaaaaaaaaaaaaaaaaaas

  • @nataliamorenonunez8685
    @nataliamorenonunez8685 ปีที่แล้ว

    podrias subir el cofdigo a algun repositorio?

  • @fabriziocossiozacarias6653
    @fabriziocossiozacarias6653 2 ปีที่แล้ว +1

    Eres un crack!

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว

      Muchas gracias. Saludos y Bendiciones 🙌💻

  • @germanconde451
    @germanconde451 2 ปีที่แล้ว +1

    excelente!

  • @angelinatorero9541
    @angelinatorero9541 ปีที่แล้ว

    la verdad que lo mío es una actividad, y solo me pide logo copy y mi nombre y que sea responsive, y que cuando sea responsive no aparezca el copy,solo el logo y mi nombre. pero no consigo hacerlo, y todos los tutoriales que he visto, me sacan que si redes sociales etc etc. y el mas sencillo que es el que busco yo, no lo encuentro por ningún lado. podrías hacer tutoriales para estudiantes.

  • @rensopignanelli4911
    @rensopignanelli4911 2 ปีที่แล้ว

    donde puedo descargar este footer???

  • @anthonyramirez9394
    @anthonyramirez9394 2 ปีที่แล้ว

    Gracias :p, me suscribo

  • @juanleon4741
    @juanleon4741 2 ปีที่แล้ว

    Faltó un queño detalle.. no es footer si no está ubicado al final de la página.. asi como lo dejaste parece un header!!

  • @osbrielcordoba895
    @osbrielcordoba895 2 ปีที่แล้ว +1

    ty, bro :)

  • @c13kemer
    @c13kemer 2 ปีที่แล้ว

    Ggracias bro eres un crack

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว

      Hola, muchas gracias por su comentario. Saludos y Bendiciones💻🙌

  • @alexandertellezgarcia5272
    @alexandertellezgarcia5272 ปีที่แล้ว

    MUY BUENO

  • @Devcarmenn
    @Devcarmenn 2 ปีที่แล้ว

    excelente video

  • @Flexeando
    @Flexeando 2 ปีที่แล้ว +1

    creo q el footer tendria q ir abajo, creo........ jajajaj

    • @SLeeDw
      @SLeeDw  2 ปีที่แล้ว

      Hola, si estás en lo cierto que el footer debe ir abajo. Y para lograr que se posicione abajo. Sólo debes agregar tu contenido (texto, imágenes, etc.) En la parte de arriba del footer. Saludos y Bendiciones 🙌💻

  • @lucymendozarex38
    @lucymendozarex38 2 ปีที่แล้ว

    know you all who are passionate about making soft have the exact sa capacity I do to learn tNice tutorials software. So go do what you love,

  • @omarflores5053
    @omarflores5053 ปีที่แล้ว +1

    Sabes que footer no?

  • @nicopenaloza800
    @nicopenaloza800 2 ปีที่แล้ว +3

    una poronga

  • @elbuhonegro4146
    @elbuhonegro4146 7 หลายเดือนก่อน

    se explica del asco. hay muchas cosas que olvido mencionar y que el toma como obvias.

  • @Kyriosxxx
    @Kyriosxxx ปีที่แล้ว

    gird-gap está obsoleta

  • @CarlosKesqui
    @CarlosKesqui 2 ปีที่แล้ว

    ¡Gracias!