Want to create interactive content? It’s easy in Genially!

Get started free

Feliz Cumpleaños - Trinket

Erica De Pacheco

Created on May 19, 2025

Start designing with a free template

Discover more than 1500 professional designs like these:

Corporate CV

Interactive Onboarding Guide

Higher Education Teaching Microsite

Modern microsite mobile

Basic Shapes Microsite

Basic Interactive Microsite

Beauty catalog mobile

Transcript

La tarjeta de cumpleaños hasta este momento parece bastante aburrida, así que vas a hacer algunos cambios en el código HTML y CSS.

Feliz Cumpleaños

HTML & CSS

Empezar

Vamos a usar lo que estas aprendiendo sobre HTML y CSS para crear tu propia tarjeta de cumpleaños personalizada.

10

¿Listo para comenzar? ¡Haz clic en el enlace al editor y sorprendete!

Ir al Proyecto

Importante: Nunca olvides de guardar tu proyecto en la medida que vas avanzando.

10

Ve a la línea 14 del código HTML. Prueba a editar el texto para personalizar tu tarjeta.

10

¿Puedes encontrar el código HTML para la imagen del robot y cambiarlo por el link de tu imagen? No borres las comillas.

10

Toca la pestaña de style.css. La primera parte son todos los estilos CSS para el exterior de la tarjeta.
Cambia background-color con el codigo de color que mas te guste. Puedes conseguirlo en
https://htmlcolorcodes.com/es/

10

También puedes cambiar el tamaño de la imagen. Ve al código CSS #outside-pic y cambia el width y la height de la imagen exterior a 200px (px representa píxeles).

10

También se puede cambiar la fuente. Ve al código CSS #outside-title y cambia la font-family a Comic Sans MS y el font-size a 16pt.

10

Desafío: crea el interior de la tarjeta.

Utiliza todo lo que has aprendido sobre HTML y CSS para terminar de crear una tarjeta personalizada.
  • Botones (bordes, color y texto)

10

Hasta aqui llegamos

Continuará...

10

Hasta aqui llegamos

Continuará...

10