Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

Desafío: personalizando el proyecto con hover

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

1 respuesta

Hola, Justin, espero que estés bien

Parece que estás intentando cambiar el color de fondo de un elemento con la clase .presentación cuando se pasa el mouse sobre él. El código que has compartido parece correcto para lograr un efecto de hover.

Aquí tienes un ejemplo completo para asegurarte de que todo funcione correctamente:

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        .presentación {
            width: 200px;
            height: 100px;
            background-color: rgb(255, 255, 255); /* Color inicial */
            transition: background-color 0.3s; /* Transición suave */
        }

        .presentación:hover {
            background-color: rgb(170, 170, 24); /* Color al pasar el mouse */
        }
    </style>
    <title>Ejemplo de Hover</title>
</head>
<body>
    <div class="presentación">
        Pasa el mouse sobre mí
    </div>
</body>
</html>

Asegúrate de que el archivo CSS esté correctamente vinculado a tu HTML si los tienes en archivos separados. La propiedad transition es opcional, pero ayuda a que el cambio de color sea más suave.

Espero que esto te ayude a personalizar tu proyecto. ¡Bons estudios!