Enlaces HTML - Diferentes colores
Un enlace HTML se muestra en un color diferente dependiendo de si se ha visitado, no se ha visitado o está activo.
Colores de enlace HTML
Por defecto, aparecerá un enlace como este (en todos los navegadores):
- Un enlace no visitado está subrayado y azul
- Un enlace visitado está subrayado y morado
- Un enlace activo está subrayado y rojo.
Puede cambiar los colores del estado del enlace usando CSS:
Ejemplo
Aquí, un enlace no visitado será verde sin subrayado. Un enlace visitado será de color rosa sin subrayado. Un enlace activo será amarillo y subrayado. Además, al pasar el mouse sobre un enlace (a: hover) se volverá rojo y subrayado:
<style>
a:link {
color: green;
background-color: transparent;
text-decoration: none;
}
a:visited {
color: pink;
background-color: transparent;
text-decoration: none;
}
a:hover {
color: red;
background-color: transparent;
text-decoration: underline;
}
a:active {
color: yellow;
background-color: transparent;
text-decoration: underline;
}
</style>
Botones de enlace
Un enlace también se puede diseñar como un botón, usando CSS:
este es un enlaceEjemplo
<style>
a:link, a:visited {
background-color: #f44336;
color: white;
padding: 15px 25px;
text-align: center;
text-decoration: none;
display: inline-block;
}
a:hover, a:active {
background-color: red;
}
</style>
Para obtener más información sobre CSS, vaya a nuestro Tutorial de CSS .
Etiquetas de enlace HTML
| Tag | Description |
|---|---|
| <a> | Defines a hyperlink |
Para obtener una lista completa de todas las etiquetas HTML disponibles, visite nuestra Referencia de etiquetas HTML .