HTML -links - verschillende kleuren
Een HTML-link wordt in een andere kleur weergegeven, afhankelijk van of deze is bezocht, niet is bezocht of actief is.
HTML-linkkleuren
Standaard verschijnt een link als volgt (in alle browsers):
- Een niet-bezochte link is onderstreept en blauw
- Een bezochte link is onderstreept en paars
- Een actieve link is onderstreept en rood
U kunt de kleuren van de linkstatus wijzigen door CSS te gebruiken:
Voorbeeld
Hier is een niet-bezochte link groen zonder onderstreping. Een bezochte link is roze zonder onderstreping. Een actieve link is geel en onderstreept. Als u met de muis over een link (a:hover) gaat, wordt deze bovendien rood en onderstreept:
<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>
Koppelingsknoppen
Een link kan ook worden gestileerd als een knop, met behulp van CSS:
Dit is een linkVoorbeeld
<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>
Ga voor meer informatie over CSS naar onze CSS-zelfstudie .
HTML-linktags
| Tag | Description |
|---|---|
| <a> | Defines a hyperlink |
Bezoek onze HTML Tag Reference voor een volledige lijst van alle beschikbare HTML-tags .