HTML Links - Verschiedene Farben
Ein HTML-Link wird in einer anderen Farbe angezeigt, je nachdem, ob er besucht, nicht besucht oder aktiv ist.
HTML Linkfarben
Standardmäßig wird ein Link so angezeigt (in allen Browsern):
- Ein nicht besuchter Link ist unterstrichen und blau
- Ein besuchter Link ist unterstrichen und lila
- Ein aktiver Link ist unterstrichen und rot
Sie können die Linkstatusfarben mithilfe von CSS ändern:
Beispiel
Hier wird ein nicht besuchter Link grün und nicht unterstrichen angezeigt. Ein besuchter Link wird rosa und nicht unterstrichen angezeigt. Ein aktiver Link wird gelb und unterstrichen angezeigt. Wenn Sie mit der Maus über einen Link fahren (a:hover), wird dieser außerdem rot und unterstrichen:
<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>
Try it Yourself »
Link-Schaltflächen
Ein Link kann mithilfe von CSS auch als Schaltfläche gestaltet werden:
Beispiel
<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>
Try it Yourself »
Um mehr über CSS zu erfahren, besuchen Sie unsere CSS Tutorial.
HTML Link-Tags
Tag | Beschreibung |
---|---|
<a> | Definiert einen Hyperlink |
Eine vollständige Liste aller verfügbaren HTML-Tags finden Sie in unserer HTML Tag-Referenz.