Aprende Desafío: Implementar Efectos Decorativos en CSS | Agregar Efectos Decorativos con CSS

Tarea

Practicar y mejorar el atractivo visual de la página web. La tarea incluye:

Agregar una sombra al elemento div con el nombre de clase card. Los valores de sombra especificados son

rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px

Añadir una imagen de fondo al elemento div con el nombre de clase card. El enlace de la imagen es el siguiente:

   https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png

index.html

index.css

Para agregar una sombra a un elemento, utilizar la propiedad box-shadow con el valor especificado. En este caso, el valor es rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px.
Para establecer una imagen como fondo usando la propiedad background-image, emplear la sintaxis url("correct path"). Dentro de los paréntesis, abrir comillas y especificar la ruta de la imagen. En esta tarea, la ruta correcta es: url("https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png").
Para determinar la posición de la imagen de fondo, utilizar la propiedad background-position. En este caso, establecer el valor center para la propiedad.

index.html

index.css

¿Todo estuvo claro?

¡Gracias por tus comentarios!

Sección 5. Capítulo 6

Pregunte a AI

Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla

Desliza para mostrar el menú

Practicar y mejorar el atractivo visual de la página web. La tarea incluye:

Agregar una sombra al elemento div con el nombre de clase card. Los valores de sombra especificados son

rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px

Añadir una imagen de fondo al elemento div con el nombre de clase card. El enlace de la imagen es el siguiente:

   https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png

index.html

index.css

Para agregar una sombra a un elemento, utilizar la propiedad box-shadow con el valor especificado. En este caso, el valor es rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px.
Para establecer una imagen como fondo usando la propiedad background-image, emplear la sintaxis url("correct path"). Dentro de los paréntesis, abrir comillas y especificar la ruta de la imagen. En esta tarea, la ruta correcta es: url("https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png").
Para determinar la posición de la imagen de fondo, utilizar la propiedad background-position. En este caso, establecer el valor center para la propiedad.

index.html

index.css

¿Todo estuvo claro?

¡Gracias por tus comentarios!

Sección 5. Capítulo 6