🎯 Reto #2: Tarjeta de presentación¶
Reto de nivel principiante
Diseña una tarjeta de presentación personal con HTML y CSS, con modo oscuro y responsive. Ideal para practicar maquetación y variables CSS.
🎯 Objetivo¶
Crea una tarjeta de presentación con:
- Foto de perfil, nombre y puesto.
- Enlaces a redes sociales.
- Botón de modo oscuro/claro.
- Diseño responsive.
🧠 Conceptos¶
- HTML semántico
- CSS Grid o Flexbox
- Variables CSS
- Media queries
🖥️ Editor¶
Solución
```javascript document.getElementById('tema').addEventListener('click', () => { document.body.classList.toggle('dark'); }); ```
🚀 Retos extra¶
- [ ] Que la foto sea una imagen real con `border-radius: 50%`.
- [ ] Que el modo oscuro se guarde en localStorage.
- [ ] Que respete la preferencia del sistema con `prefers-color-scheme`.