Curso Práctico de HTML y CSS

Clases del Curso Práctico de HTML y CSS

Instruido por:
Diego De Granda
Diego De Granda
Básico
2 horas de contenido
Ver la ruta de aprendizaje
Clon de Google
Proyecto del curso
Clon de Google

Crea un clone de la página de Google y pon en práctica tus conocimientos de CSS y HTML.

Curso Práctico de HTML y CSS

Curso Práctico de HTML y CSS

Progreso del curso:0/17contenidos(0%)

Contenido del Curso
Tutoriales de estudiantes
Preguntas de estudiantes

Progreso del curso:0/17contenidos(0%)

Introducción

#PlatziCodingChallenge || PlatziCodingChallenge

02:51 min

Material Thumbnail

Lo que aprenderás sobre HTML y CSS

03:21 min

Análisis y creación del proyecto

Material Thumbnail

Análisis del proyecto Google Clone

03:09 min

Material Thumbnail

Configuración del proyecto

05:49 min

Chrome Dev Tools como herramienta

Material Thumbnail

Chrome Dev Tools

03:05 min

Header Google Clone

Material Thumbnail

Maquetado del Header

06:56 min

Material Thumbnail

Agregando estilos al Header

08:27 min

Material Thumbnail

Posicionar una lista en horizontal

08:43 min

Material Thumbnail

Manejo de íconos e imágenes en etiquetas

09:42 min

Contenido principal Google Clone

Material Thumbnail

Maquetado de la sección principal

08:05 min

Material Thumbnail

Estilos en la sección principal

07:54 min

Material Thumbnail

Estilos en la sección del input

10:58 min

Material Thumbnail

Íconos y manejo de background hover

13:12 min

Material Thumbnail

Estilos en los botones

10:28 min

Footer Google Clone

Material Thumbnail

Maquetado del Footer

04:14 min

Material Thumbnail

Estilos en Footer

10:57 min

Cierre

Material Thumbnail

Cierre: diferencias entre CSS Grid y Flexbox

02:15 min

nuevosmás votadossin responder
Emilio Sanchez Rivera
Emilio Sanchez Rivera
Estudiante

Hola, no entiendo cómo hacerle para abrir la página donde aparecen “Gmail, Imágenes, etc.”, ¿qué es lo que debo hacer después de abrir el Live Server?

1
Anyelo Leonardy Alvarez Baquero
Anyelo Leonardy Alvarez Baquero
Estudiante

Hola, ¿cómo puedo hacer que el hover (borde verde) afecte toda la barra de búsqueda?tinygoogleHover.pngtinygoogleHtml.png

1
Ernesto Gutierrez
Ernesto Gutierrez
Estudiante

hola me podrían ayudar con una pregunta…
Los iconos dentro del input se me estan posicionando uno encima del otro. por que me pasa eso?

1
Cleysson Yamid Padilla Cortés
Cleysson Yamid Padilla Cortés
Estudiante

logré el mismo efecto usando display flex en la clase .main-buttons y luego justify content y align items, pero supongo que si el profe lo hizo con inline-block debe tener una razón, la pregunta es: ¿porque es mejor hacerlo con inline-block y no con flex? o mejor ¿Que debe tenerse en cuenta para elegir uno u otro?

2
Hugo Ulises Esterripa Contreras
Hugo Ulises Esterripa Contreras
Estudiante

Consulta, como hago para que al darle click al Open with live server, este se abra en mi google chrome dev y no en el chrome normal

1
Martha Liliana Dominguez Gonzalez
Martha Liliana Dominguez Gonzalez
Estudiante

He variado ligeramente los estilos, quería saber si está correcto de todos modos si visualmente se ve bien?
.
Por ejemplo, en lugar de añadir márgenes, usé justify-content: space-evenly; para distanciar los listed items. (?)

2
holger6311
holger6311
Estudiante

En vez de utilizar un “URL” para insertar el icon. No sería mejor poner una imagen bajada del internet para poder utilizarla en el Código de css, y cual es la diferencia en usar un “URL” con una imagen que uno tiene guardada en la computadora. I cual seria el link para insertar una imagen guardada en la computadora para poder usar como icon en la página web.

3
María Del Pilar Chávez Gutiérrez
María Del Pilar Chávez Gutiérrez
Estudiante

Hice todo este curso siguiendo los pasos exactamente igual que el profe Diego y debo decir que estoy muy feliz con el resultado que tuve ya que fue la página de google igualita a la original pero no se si les pasa que a la hora de poner en práctica lo aprendido y hacerlo solos se traban? Es justo lo que me pasa 😬🥴 ¿Algun consejo, tip, aporte? Se los agradecere mucho 💚

20
Alejandro Oliva Caballero
Alejandro Oliva Caballero
Estudiante

por que las url pueden llegar a ser tan largas ?

1
codingworlds
codingworlds
Estudiante

¿Cuál es la diferencia entre colocar la url de una imagen desde el CSS o desde el HTML?

3