No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

No se trata de lo que quieres comprar, sino de quién quieres ser. Invierte en tu educación con el precio especial

Antes: $249

Currency
$209

Paga en 4 cuotas sin intereses

Paga en 4 cuotas sin intereses
Suscríbete

Termina en:

11 Días
21 Hrs
41 Min
31 Seg

Estilos para las imágenes de redes sociales

13/27
Recursos

Aportes 24

Preguntas 14

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Explicaciones super claras, Buenísimo curso

Para iniciar e incluso para afianzar conocimientos está muy buena la explicación.

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Live color picker Con esta extensión se les facilita saber el color de algún elemento, yo la uso en Chrome

Increíble lo sencillo que es crear una primera página de presentación! 😄

Muy bueno el curso, seria bueno que dejaran los archivos e imagenes en recursos para poder trabajar el ejercicio con mayor facilidad, pero igualmente esta muy bien explicado

Muy bueno el curso, puede uno pensar que se pasa de básico la explicación, pero es necesario. Incluso para repasar explicaciones.

creo entender lo que sucede, fijate en CSS en el apartado de este video cambiamos el estilo de

> main .social-icons li {
	width: 100% ;
	height: 100% ;
}

y esto hace que el ancho de las imagenes se coloquen respecto al ancho del texto que tenemos arriba que tambien esta dentro de main y de P
Intenta cambiar a

main .social-icons img {
	width: 100% ;
	height: 100% ;
}

notaras que las imagenes se acomodan correspondiente al tamaño original que tienen, intenta cambiarle
width: 20px y height: 20px

Excelente Clase. Muy buena introducción a la creación web.

Me gusta cómo explica este profe. Más cursos con él por favor.

Les recomiendo este sitio para buscar iconos

Te permite lo siguiente

  1. Descargar en PNG
  2. Descargar en SVG
  3. Copiar codigo SVG para usar directo en HTML o Figma
  4. Copiar link para usarlo en Notion
  5. Seleccionar un color determinado (aunque eso pude quedar de lado cuando ya sepas usar CSS)
![](https://static.platzi.com/media/user_upload/image-54316d05-d0c5-45a4-9c11-aaecbbc9a395.jpg) Hola, me quedan los iconos sin color. Hice la prueba con Instagram y le puse que coloque el fondo rojo, pero no se cambia... y los demás iconos desaparecieron cuando quite el background de "main .social-icons { */\* Estilos de main \*/* main {     padding: 100px;} main .social-icons {     display: flex;     justify-content: center;     margin-top: 40px;     margin-top: 40px;     list-style: none; }main .social-icons li {     margin-left: 8px;} main .social-icons .social-icon {     display: flex;     justify-content: center;     align-items: center;     padding: 15px;     border-radius: 5px;     width: 100%;     height: 100%; } main .social-icons #Instagram {     background: red; }
pueden decirme el por que se ve asi ? ![](https://static.platzi.com/media/user_upload/image-95b24172-40fa-4055-8210-9aecc613bad2.jpg)
¡¡Ayuda!! Hice todo exactamente como en el código pero mi elemento de instagram está prácticamente inexistente .¿Les sucedió eso? ¿Cómo lo solucionaron? ![](https://static.platzi.com/media/user_upload/image-dc559405-f887-4c13-94e4-03f0ee055283.jpg)

El profesor explica tan sencillo que entendí mejor que en el de programación básica.

Genial!

<
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

> 
  • <meta name=“viewport” content=“width=device-width, initial-scale=1.0” /> : Es una etiqueta que se coloca en la sección head del documento HTML para definir cómo se debe ajustar el contenido del sitio web al dispositivo que lo está mostrando. Con esta etiqueta, se establece la anchura del dispositivo como el ancho inicial y se define el nivel de zoom que se aplicará a la página.
  • justify-content: Es una propiedad de CSS que se utiliza para alinear y distribuir elementos dentro de un contenedor en el eje horizontal. Permite alinear los elementos al inicio, al final, al centro, distribuirlos uniformemente o separarlos por igual.
  • align-items: Es una propiedad de CSS que se utiliza para alinear elementos dentro de un contenedor en el eje vertical. Permite alinear los elementos al inicio, al final, al centro o distribuirlos uniformemente.
  • list-style: Es una propiedad de CSS que se utiliza para establecer la apariencia de las viñetas o numeración de una lista. Permite definir el tipo de viñeta o numeración, su posición y su imagen de fondo.

Llevo tomando varias clases de varios temas, pero encontre esta clase que me intereso y con este profesor no me quedo ninguna duda, todo le entendi, explica muy bien y lleva el hilo conversacional de la clase perfectamente

ME GUSTO EL RESULTADO!! ya esta casi terminado, con solo dos lenguajes la verdad es que si se hace un buen avance jeje

Excelente, a pesar de ser un curso introductorio las clases son buenísimas. Creo que Carlos debería dictar los cursos de Celis.

Acá pueden encontrar una guía para profundizar en flex-box. https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Excelente profesor explica paso a paso y no deja nada en el aire y hasta lo más obvio lo explica uno de los mejores super recomendado

Un diseño de página CSS utiliza el formato de hojas de estilos en cascada, en lugar de las tablas o marcos HTML tradicionales, para organizar el contenido de un sitio web. El elemento básico del diseño CSS es la etiqueta div, una etiqueta HTML que, en la mayoría de los casos, actúa como contenedor de texto, imágenes y otros elementos de página. Cuando crea un diseño CSS, coloca etiquetas div en la página, añade contenido a las mismas y las sitúa en distintos lugares. A diferencia de las celdas de tabla, que solo pueden situarse en algún lugar dentro de las filas y columnas de la tabla, las etiquetas div aparecen en cualquier lugar de una página web. Puede situar etiquetas div de forma absoluta (especificando las coordenadas x e y) o de forma relativa (especificando su ubicación con respecto a su ubicación actual). También puede situar etiquetas div especificando elementos flotantes, rellenos y márgenes (el método preferido conforme al estándar web actual).