CSS - Pseudo-clase: hover

Descripción

La pseudoclase: hover se usa para agregar un efecto especial a un elemento cuando pasa el mouse sobre él.

Al definir pseudoclases en un bloque <style> ... </style>, se deben tener cuidado con los siguientes puntos:

a: hover DEBE ir después de un: enlace y un: visitado en la definición de CSS para que sea efectivo.
a: active DEBE ir después de a: hover en la definición de CSS para que sea efectivo.
Los nombres de pseudoclase no distinguen entre mayúsculas y minúsculas.
La pseudoclase es diferente de las clases CSS pero se pueden combinar.

Valores posibles

color - Cualquier valor de color válido.

Se aplica a

Elemento de anclaje / enlace.

Ejemplo

A continuación se muestra el ejemplo que demuestra cómo usar la clase hover para cambiar el color de los enlaces cuando colocamos el puntero del mouse sobre ese enlace.

<html>
   <head>
      <style type = "text/css">
         a:hover {color: #FFCC00}
      </style>
   </head>

   <body>
      <a href = "/html/index.htm">Bring Mouse Here</a>
   </body>
</html>

Esto producirá el siguiente enlace. Ahora coloca el mouse sobre este enlace y verá que cambia su color a amarillo.

↰ Previous page