HTML -Tutorial

HTML-HOME HTML-Einführung HTML-Editoren HTML-Basis HTML-Elemente HTML-Attribute HTML-Überschriften HTML-Absätze HTML-Stile HTML-Formatierung HTML-Zitate HTML-Kommentare HTML-Farben HTML-CSS HTML-Links HTML-Bilder HTML-Favicon HTML-Tabellen HTML-Listen HTML-Block und Inline HTML-Klassen HTML-ID HTML-Iframes HTML-JavaScript HTML-Dateipfade HTML-Kopf HTML-Layout HTML-responsiv HTML Computercode HTML-Semantik HTML-Styleguide HTML-Entitäten HTML-Symbole HTML-Emojis HTML-Zeichensatz HTML-URL-Codierung HTML vs. XHTML

HTML -Formulare

HTML-Formulare HTML-Formularattribute HTML-Formularelemente HTML-Eingabetypen HTML-Eingabeattribute HTML-Eingabeformularattribute

HTML -Grafiken

HTML-Leinwand HTML-SVG

HTML- Medien

HTML-Medien HTML-Video HTML-Audio HTML-Plugins HTML-YouTube

HTML -APIs

HTML-Geolokalisierung HTML-Drag/Drop HTML-Webspeicher HTML-Webworker HTML-SSE

HTML- Beispiele

HTML-Beispiele HTML-Quiz HTML-Übungen HTML-Zertifikat HTML-Zusammenfassung HTML-Barrierefreiheit

HTML -Referenzen

HTML-Tag-Liste HTML-Attribute Globale HTML-Attribute HTML-Browser-Unterstützung HTML-Ereignisse HTML-Farben HTML-Leinwand HTML-Audio/Video HTML-Doctypes HTML-Zeichensätze HTML-URL-Codierung HTML-Sprachcodes HTTP-Nachrichten HTTP-Methoden PX-zu-EM-Konverter Tastatürkürzel

HTML -Links - Verschiedene Farben


Ein HTML-Link wird in einer anderen Farbe angezeigt, je nachdem, ob er besucht, nicht besucht oder aktiv ist.


Farben für HTML-Links

Standardmäßig wird ein Link wie folgt angezeigt (in allen Browsern):

  • Ein nicht besuchter Link ist unterstrichen und blau
  • Ein besuchter Link ist unterstrichen und violett
  • Ein aktiver Link ist unterstrichen und rot

Sie können die Farben des Linkstatus ändern, indem Sie CSS verwenden:

Beispiel

Hier ist ein nicht besuchter Link grün und nicht unterstrichen. Ein besuchter Link ist rosa ohne Unterstreichung. Ein aktiver Link wird gelb und unterstrichen sein. 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>

Verknüpfungsschaltflächen

Ein Link kann auch als Schaltfläche gestaltet werden, indem CSS verwendet wird:

Dies ist eine Verbindung

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>

Um mehr über CSS zu erfahren, besuchen Sie unser CSS-Tutorial .


HTML-Link-Tags

Tag Description
<a>Defines a hyperlink

Eine vollständige Liste aller verfügbaren HTML-Tags finden Sie in unserer HTML-Tag-Referenz .