:link

Probieren Sie es aus

p {
  font-weight: bold;
}

a:link {
  color: forestgreen;
  text-decoration-color: hotpink;
}

<p>Pages that you might have visited:</p>
<ul>
  <li>
    <a href="https://developer.mozilla.org">MDN Web Docs</a>
  </li>
  <li>
    <a href="https://www.youtube.com/">YouTube</a>
  </li>
</ul>
<p>Pages unlikely to be in your history:</p>
<ul>
  <li>
    <a href="https://developer.mozilla.org/missing-2">Random MDN page</a>
  </li>
  <li>
    <a href="https://example.com/missing-2">Random Example page</a>
  </li>
</ul>

Stile, die durch die Pseudoklassen :link und :visited definiert sind, können von nachfolgenden User-Aktionen-Pseudoklassen (:hover oder :active), die mindestens die gleiche Spezifität haben, überschrieben werden. Um Links angemessen zu gestalten, setzen Sie die :link Regel vor alle anderen linkbezogenen Regeln, wie durch die LVHA-Reihenfolge definiert: :link — :visited — :hover — :active. Die :visited-Pseudoklasse und die :link-Pseudoklasse sind gegenseitig exklusiv.

Syntax

:link {
  /* ... */
}

Beispiele

Standardmäßig wenden die meisten Browser einen speziellen color-Wert auf besuchte Links an. Daher werden die Links in diesem Beispiel wahrscheinlich nur vor dem Besuch spezielle Schriftfarben haben. (Danach müssen Sie den Browserverlauf löschen, um sie erneut zu sehen.) Die background-color-Werte bleiben jedoch wahrscheinlich erhalten, da die meisten Browser diese Eigenschaft standardmäßig nicht auf besuchte Links setzen.

HTML

<a href="#ordinary-target">This is an ordinary link.</a><br />
<a href="">You've already visited this link.</a><br />
<a>Placeholder link (won't get styled)</a>

CSS

a:link {
  background-color: gold;
  color: green;
}

Ergebnis

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Link-bezogene Pseudoklassen: :visited, :hover, :active