Las pseudoclases son una forma de describir el estado del enlace o dan efecto a la etiqueta de anclaje <a> . Un usuario puede mostrar un enlace ya sea que haya sido visitado anteriormente o esté en estado de ejecución,
También podemos cambiar el signo del cursor cuando el mouse está sobre él. Tiene la siguiente sintaxis.
Sintaxis:
selector:pseudo-class { property: value; }
Hay básicamente cuatro estilos que representan el estado del enlace.
1. enlaces: representa una palabra u oración en particular como un enlace. Es de color azul, lo que básicamente muestra que es un enlace no visitado o que el usuario nunca ha hecho clic en ese enlace.
2. Enlace visitado: Esto muestra que el enlace en particular ha sido visitado anteriormente por el usuario. En este ejemplo, el enlace visitado se ha mostrado con el color rojo.
3. pasar el mouse: cuando el mouse está sobre el enlace. Ayuda a captar la atención del lector en el enlace. Se ha mostrado con color verde. Cuando el mouse esté sobre el enlace, el color del enlace cambiará a color verde.
4. Activo: después de hacer clic en el enlace, el enlace cambia su estado a un estado activo que representa que la página vinculada a ese enlace se está cargando. Por un tiempo, permanece activo hasta que la página se carga por completo.
El estado activo se muestra en color naranja. Por ejemplo, entendamos esto con un ejemplo.
HTML
<!DOCTYPE html>
<html>
<head>
<title>Pseudo-Classes</title>
<style>
a:link {
color: blue;
}
a:visited {
color: red;
}
a:hover {
color: green;
}
a:active {
color: orange;
}
</style>
</head>
<body>
<h2>Welcome To GFG</h2>
<p><a href="https://www.geeksforgeeks.org">
Click on this link to see the effects.
</a>
</p>
</body>
</html>
Producción:
Publicación traducida automáticamente
Artículo escrito por shalinipriya1011 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA