CSS - Pseudo-clase: foco

Descripción

La pseudoclase: focus se usa para agregar un efecto especial a un elemento mientras el elemento tiene el foco.

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.
Las pseudoclases son diferentes 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 : clase de enfoque para cambiar el color de los enlaces enfocados.

<html>
   <head>
      <style type = "text/css">
         a:focus {color: #0000FF}
      </style>
   </head>

   <body>
      <a href = "/html/index.htm">Click this Link</a>
   </body>
</html>

Esto producirá el siguiente enlace. Esto cambiará su color a naranja cuando este enlace se enfoque, luego se enfocará en cualquier otro enlace para ver que este color cambiará cuando pierda el enfoque.

↰ Previous page