💻 COMO crear una PAGINA WEB en HTML y CSS [PASO A PASO] Adaptable a DISPOSITIVOS MÓVILES #2
ฝัง
- เผยแพร่เมื่อ 25 ส.ค. 2024
- El día de hoy veremos, como crear una pagina web desde 0 con HTML y CSS, la cual es adaptable a dispositivos móviles y como proyecto final, la subiremos a un hosting y dominio.
♦️Hosting usado en el video: www.hostinger....
♦️Código de descuento: “ALEXCG”
♦️Descarga la página web: bit.ly/2mXRxT3
👇👇👇Ver más👇👇👇
No te olvides de dejar un comentario de que te gustaría ver en cursos previos de mi canal y suscribirte al canal, porque con AlexCG Design, crecemos juntos!
👨💻🎁 Aprende Diseño Web Desde Cero(Descuento) 👉 alexcgdesign.c...
📌 Links interesantes 📌
▶️ ¿Necesitas una página web?: bit.ly/2VaUUGt
▶️ Blog de desarrollo web: bit.ly/2DJM0oF
▶️ ¿Te gustó el vídeo? Suscribete aquí: www.youtube.co...
✉️ Redes sociales ✉️
▶️Facebook: goo.gl/7o77tx
▶️Linkedin: goo.gl/byCJnS
▶️Github: github.com/Ale...
▶️ Página web: bit.ly/2VaUUGt
Tags:
![💻 COMO crear una PAGINA WEB en HTML y CSS [PASO A PASO] | Adaptable a DISPOSITIVOS MÓVILES](http://i.ytimg.com/vi/HH_SMpxV7qQ/mqdefault.jpg)
![[TH] VALORANT Champions Seoul - Grand Final - EDG vs TH](http://i.ytimg.com/vi/WvObMc9VelI/mqdefault.jpg)
♦️Hosting usado en el video: www.hostinger.com/alexcg
♦️Código de descuento (15% de descuento): “ALEXCG”
hola... tengo una pregunta sobre este video, como haces para modificar las resoluciones de pantallas desde el buscador??? se puede hacer desde cualquier buscador??
Puedes hacer un chat en vivo para hablar con el usuario
Opinas que para hacer el diseño de una página web hoy en día se debería hacer un diseño primero para el móvil y luego uno para computadoras?
i know im asking the wrong place but does anyone know of a trick to get back into an Instagram account..?
I somehow lost the account password. I would love any assistance you can offer me!
Hola, Alex al momento de mandar mi zip al hosting me la descarga, pero me lo descarga vacia. Puedes ayudarme es para hoy :(
Bro eres una pistola, acabo de descubrir tu canal, vi los videos que has subido y se que podré aprender muchísimo con todo el conocimiento que has compartido, gracias✌
Que aporte tan grande nos acabas de dar, continua haciendo mas paginas asi, por ejemplo de restaurantes, librerias, tiendas... Dios te bendiga.
Muchísimas gracias por ayudarnos con este video tan increíble, me sirve demasiado para practicar lo que he aprendido, y además explicas excelente
Te ganaste un nuevo subscriptor, muy buenos los vídeos desde hace tiempo quería entrar en el mundo de la programación y hoy descubrí tu canal, muchas gracias bro ♥️
Alex! Explicas excelente! recien estoy empezando con html y css. Entendi todo super bien y ya pude hacer una pagina bastante parecida! Muchas Gracias! ,Saludos
Muchas gracias tocayo, espero mas adelante poder hacerlo sin seguir un tutorial, aun soy novato y realmente me atore en dos tres cosillas pero viendo el video me quedo casi igual.
Excelente la explicación. Muchas gracias por compartir tus conocimientos.
tengo una humilde opinion, pague un curso sobre html y css con php. la verdad seguí todos los pasos entendi y vi como mandar a llamar las css de donde viene como estructurar en palabras mas sencillas eres muy práctico para enseñar y rápido hice la página en 2 videos termine una página web muchas gracias.
MUY BUENO TUS TRABAJOS Y LA AYUDA QUE DAS A LOS QUE ESTAMOS INICIANDO...MUCHAS GRACIAS BRO
continuamos con la segunda parte del video. muchas gracias por esta super pagina.
Hace unos años vi esta pagina y me llamó mucho la atención y empecé a aprender sobre html y ccs hice tus cursos de Udemy muy recomendables. y después de tanto tiempo recordé que tenía esta tarea pendiente. y acá estamos ya con media pagina lista y con ganas de dejarla mas que excelente. Dejé que corran todos los anuncios para de esta manera aportar algo a tu canal en forma de retribución por todo lo que nos das.
COMO CREAR +3 PÁGINAS WEB DESDE CERO (HTML & CSS)
th-cam.com/video/OQIe_7lKpDw/w-d-xo.html
Hola Matías, gracias por tu apoyo!!
Por cierto si quieres crear más páginas web aquí arriba te dejo más retos ☝️☝️☝️
Un saludo enorme!
@@AlexCGDesign gracias por responder entonces eso será lo siguiente. Con esta ya seria mi 3 página hecha con tus enseñanzas. Y bueno si hago esas 3 ya serían 6 todo suma para el portafolio
unos de los mejores videos muy bueno par explicar
gracias alex por compartir tus conocimientos eres grande, me estaba volviendo loco con css xd. Tu forma de maquetar es increible.
Muy buen vídeo esta todo muy bien explicado. Me estoy iniciando en el mundo de HTML y estoy aprendiendo mucho contigo gracias.
X2
Gracias profe....me haz enseñado mucho el día de hoy
Muchisimas gracias todo super bien explicado :) un amigo me recomendo tu canal y super buenisimo contenido
muchas gracias por la practica Alex,me sirve mucho. Saludos
Hola muchas gracias por tu curso es muy interesante y de gran ayuda.
Muy genial la verda, me ayuda mucho para mi carrera, la verdad felicitaciones
muy buen curso hermano de verdad muchas gracias ,solo una duda , me paso lo mismo con las cards una se hizo en ovalo y la otra estaba bien , y cuando le dimos formato al texto dentro de las cards las dos se ajustaron bien ,pero porque paso eso?
Me encanta como enseñas, muchas gracias.
Gracias por el video, he aprendido demasiado!!!!
Muchas gracias, me ayudaste a ganar el semestre, un abrazo grande
me Encanto muchas gracias, realmente eres increíble
Gracias por los videos bro, me han servido mucho, no se como te entiendes mezclando ingles y español a la ves XD
está buenísimo de verdad me ayudó mucho, gracias!!!
Excelente se ve muy genial te sigo paso a paso y quedo igual.
Hola, excelente video solo una duda, tú ya no cambiaste en la parte de nuestros servicios pero en mi caso los primeros dos quedan con un espacio entre ellos y los dos de abajo quedan juntos, que puedo hacer ahí?
que buena forma de explicar. muy bien todo el video .manito arriba para ti bro! sos un crack.
Excelente vídeo hermano muchas gracias!
Que herramienta es la que hace que tu puedas modificar el width del display? en el navegador?
Muy bueno tu contenido. Saludos
bro no sabes cuanto me salvaste, te ganaste un like y una subscripcion
Que grande!!! gracias por toda la info!!!
Gracias a ti!!
Hola, fíjate que he hecho todos los procesos, pero no logro hacer que aparezca la imagen y el degradado de fondo.
Excelentes videos Alex! muchas gracias por compartir ese conocimiento :)
Excelente y gracias por el curso hermano!
Excelente te apoyo es hora de reventar el boton de likes
excelente explicación me encanto, hace tiempo buscaba algo así.
muchas gracias.
tienes mas trabajos parecidos??
disculpen saben como puedo solucionar el error at-rule or selector expected en css
Hola donde puedo ver, la opción de adaptación a escritorio?
hola, en la sección de clientes como puedo agregar un tercer cliente y colocarlo abajo de los dos ya existentes?
Excelente video, nuevo sub
Que onda Jordan, te puedo mandar el codigo de la que acabo de hacer? la hize diferente pero me guiè de la tuya, que tal si le echas un ojo ? va?
muy bueno tu video, clarificante
estoy empezando, y en css lo que escribo no cambia de color, y claro no funciona en la página, solo funciona lo que escribo en números pero los comandos (no se como se llaman) en letras no, esos se quedan en color blanco, que hago ?
gracias muy bueno
Hola no se q problema tengo q no me detecta los @media y no muestra los cambios
porque una imagen sigue estando grande? no se acopla como las demas imagenes a la hora de mover la dimension responsiva, la imagen mencionada es igual a unas imagenes ya colocadas en el codigo, alguien me podria orientar?
muchas gracias por estos videos de verdad se te agradece
Gracias a ti amigo, por seguirme:)
Bien,
Buenazo
Muchas Gracias, tienes mi like!!!
Duda: a la hora de hacerlo responsive, en la de 250px ¿por que no se me actualiza el tamaño de .textos-headers h1? Intente cambiar la cantidad de px pero queda igual
como le hago para entrar en modo responsive en el explorador?
Oye una duda, ¿como le hago para que el nav baje a la vez que yo voy bajando a la página? Es que se queda arriba :s
Muchas gracias... Excelente vídeo
Gracias Abner, saludos
mi amigo despues de varios meses tratando de hacer alguna web, encontré la solución muy bien explicado
Qué bueno amigo, saludos!
@@AlexCGDesign veo que usas como navegador Firefox, es mejor que Chrome para el diseño web?
Gracias por tu aporte Alex. Tengo una pregunta ojala me la pudieran responder. En el minuto 27:07, reduces el padding-top directamente sobre el selector .sobre-nosotros , ¿por que no en su lugar moviste el pading sobre el selector .contenedor?. Gracias de antemano por tu valioso aporte
😉Ya encontre la razon, es por razones es especificidad, ya que hay otro contenedor que usa el mismo selector, de esa manera no se vea afectado el padding de dicho contenedor. De cualquier manera gracias
Tengo problemas existenciales con la parte de servicios y no se que hacer, ya le cambié en tamaño de la imagen, intentando dejarlas al mismo tamaño, revise el código y no encuentro mi error. Yo solo tengo dos servicios, no tres
Resulta!
Que por alguna razón que desconozco, mi servicio de la izquierda es muchísimo más pequeño, pero la info me aparece debajo de la imagen. Pero la imagen de mi servicio de la derecha está enorme, el título aparece a un lado, justo en medio de las tres líneas de información que tengo... No se si me di a entender... Pero ese es mi problema y no se que hacer 😭😭
Ayuda!
Si uno de ellos es diferente, probablemente sea por qué no está dentro de la etiqueta clase que estás editando, por eso solo afecta a uno y al otro no
Costemo curioso, la verdad ya revisé, pero tal vez se me pasó eso y no lo veo, gracias por tu observación! lo volveré a revisar
Tus videos son geniales.
Gracias Diego, saludos
Eres lo mejor,😎😎
Hola, me gusto mucho el tutorial, pero me quedo una duda, se puede fijar el menú en la parte superior? (utilice id para los links)
Muchisimas gracias realmente bueno tu tutorial, el único detalle es que en la parte de servicio yo solo puse 2 fotos y el titulo y texto me quedan al costado derecho, así que espero poder solucionarlo :'( y lo otro la herramienta space-evenly o algo así en sublime text no existe, cuál debería utilizar que lo asimile ? space-between o space-around ?? Gracias
bro que usas para cambiarle de tamaño a la paginna en tiempo real para ver que cambiarle
sos el mejor!
Hola Alex, excelente video, Amigo, te felicito y agradezco mucho tus cursos, soy seguidor tuyo y he adquirido dos cursos de Udemy, tengo una duda respecto a este proyecto: cuando lo publico en el servidor local de localhost funciona perfecto pero al subirlo a Hostinger no funciona el target de la galería, ¿me puedes ayudar?, gracias, abrazo amigo,
Si claro, mándame una foto en udemy con tu código:))
tenes una muestra de como modificar el menu incicio, contacto, etc y que abra como nueva pestaña?
muy buen video excelente
me ayudas mira te cuento toda la pirmera parte si me funciono pero ya en el css no me funciona nada me puedes ayudar
Hola Alex. Muy buenos tus videos. Estoy haciendo mi pagina con base en tus videos pero adaptándola a mis necesidades. Tengo varias preguntas, hay alguna forma de contactarte que no sea por aca? muchas gracias.
Hola Alex, en varios puntos no me dió el código, lo he revisado 50 veces y parece estar bien pero el resultado no me da , quiero llorar , la parte del footer no me da la distribución y en la galería el efecto que tienes tampoco .(
ya no hay pt3?
Hola Alex, buenos días, disculpa una pregunta, hay alguna razón por la cual la imagen de portada, no se pueda visualizar en los iphones? me ha sido de gran ayuda tu video pero solo tuve ese problema al hacer la pagina. Saludos
thanks so much man
que tal hermano como estas, estoy intentando hacer lo que haces en la parte de servicios, lo hago igual pero no me quedan uno al lado del otro, ¿que puedo hacer?
como haces para que la página cambie de esa manera? 13:05
Excelente 😉
cuando realice el section de clientes me aparecen las dos trarjetas lilas una arriba de otra y no en vertical a que se debe eso ? :(
revisa que las reglas hayan quedado para la clase .cards y no para .card, tuve el mismo problema y lo solucione de esta forma
super
Hola, como se guarda todo para que queden los archivos y poder subirla a un hosting
hola como se llama scala responsive donde esta, propiedades o donde en whale browser
Yo estoy comenzando, quiero convertirme en web developer y tu me has ensañado mucho... voy a pasar por udemy a ver si adquiero un curso tuyo.
Claro Diego, te deseo lo mejor como web developer, cualquier cosa estoy para aconsejarte! :)
Cómo es que se llama la extensión para cambiar el tamaño de la pantalla?
Hola Alex como estás soy tomas de argentina, entendí todo tu curso y eres exelente pero la parte de publicar mi página con hostinger para que esté ya en Google me parece imposible ya hace días que no lo puedo hacer seguí tus paso peor hay cosas que no aparecen y se me resulta muy difícil si me puedes ayudar sería genial pague también un dominio y un hosting en hostinger pero también me perdí y no logro avanzar para poder publicar mi página
hola alex, disculpa, alguien me puede decir como o que instalas para poder cambiarle la resolución a la pantalla y verlo como móvil?
Hola Alex de ese ejemplo que estas creando puedo tomar algunas ideas y crear otro?
Claro sin ningun problema:))
Hola amigo me encantan tus videos ya me suscribi, me gustaria saber como abrir una ventana nueva al momento de seleccionar cualquier objeto de la parte nuestro trabajo
¿Algo así th-cam.com/video/c3MbFWr-NT4/w-d-xo.html ?
Intente por la cabecera fija y no pude, sabes como hacerlo?
Joder, gracias brother.
Alex una consulta, en el minuto 07:38 en la parte servicio-ind img las imagenes no quedan todas con el mismo formato de alto y ancho, quedan pegadas y todas de diferente tamaño, que pudo salir mal?
Es porque no habia puesto el width de 90%, lo puso y luego actualizo la pagina.
Hola alex, el unico problema que tengo es EN JUSTIFY-CONTENT: SPACE-EVENLY Es que no me sale ese tipo de spacio :(
Oye, estaba aprendiendo todo lo de html y css pero veo que un tipo dice para que estudiar eso sí se hace fácilmente con WordPress, mi duda es, es realmente así?
Depende, si tu objetivo es hacer contenido no tendria sentido. Wordpress ya viene con plantilla predefinidas y puedes hacerles algunos cambios pero no es %100 libre. Ademas programar tu propia web te da mas libertad en todos los sentidos y el unico limite es tu capacidad.
Primero gracias por los videos!!!
Segundo no entiento el significado de esta parte en el footer:
@media screen and (max-width:900px){
header{
background-position: center;
}
tengo la misma duda, bueno, en realidad le entiendo pero no se porque no me funciona
Alex tengo un problema y es que en la parte de portafolio, las imagenes no me quieren quedar de la misma manera y solamente me aparece una el resto esta organizado hacia abajo y no se ven
tengo el mismo problema pudiste soluconarlo?
Tienes algun video para que el menu funcione en la misma pagina y no te mande a otra''
Un video increible con una excelente explicacion, solo que quisiera saber que editor de codigo html usas, yo uso notepad++, pero quisiera usar el mismo que tu.
Hola Luis, uso Visual Studio Code
Aquí te dejo unos tutoriales Tutoriales VSCODE: th-cam.com/play/PLP7LlHfxfuM-2qlWjwhSs_vBNynP-O229.html
Muchas gracias
a que tecla le doy para hacer responsive?
Ctrl+Shift+M en Mozilla Firefox
donde esta el html y el css
Hola, por favor me podrías ayudar, estoy siguiendo tu tutorial y esta excelente. Por favor, en la parte de servicio (21:49) la primera fotografía quiero que tenga un margen más grande en la parte de abajo. estoy usando el siguiente código : .servicio-ind img: first-child{margin-bottom: 30px;}
Sin embargo se aplica ese margen a todas las imágenes, que puedo hacer?, de antemano te agradezco.
para eso podrias agregarle una clase mas a la primera imagen y eso hará que solo esa imagen reciba el cambio.
Hola amigo las imagenes que usaste en la web donde las conseguiste
Aquí tengo todo lo que necesitas saber -> alexcgdesign.com/blog/crea-una-pagina-web-desde-0-con-efecto-wave/
He revisado varias veces y la imagen que sale en el galeria hover, esta recortada, he comparado el codigo y nada.
Tampoco me sale esa parte jajaja
pudiste resolver?
@@andressilva9314