Ostatnio edytowany:

:link

Autor: Virtual Patriot

Przeznaczenie selektora :link

      :link { ... }
    

Selektor :link odwołuje się do każdego elementu HTML, którego cechy w danym momencie spełniają zasadę pseudoklasy :link.

Cechy elementu HTML spełniają zasadę pseudoklasy :link, gdy w danym momencie dany element HTML jest nieodwiedzonym linkiem, czyli takim elementem HTML, który prowadzi do zasobu internetowego, który nie został jeszcze odwiedzony przez danego użytkownika.

Dodatkowe techniczne informacje o selektorze :link

ograniczenie - elementy HTML
ograniczenie - właściwości CSS
  • brak

Przykładowa reguła CSS, selektor :link

a:link {
  color:red;
}

Wyjaśnienie przykładowej reguły CSS

      a:link { color:red; }
    
a:link

Do każdego elementu a, który prowadzi do zasobu internetowego, który nie został jeszcze przez nas odwiedzony

color

dodaj właściwość CSS, która zmieni kolor tekstu elementu HTML

red

na barwę czerwoną

Kod źródłowy przykładowego dokumentu HTML

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      a:link {
        color:red;
      }
    </style>
  </head>

  <body>

    <ol>
      <li>
        <a href="#fragment-zawartosci-1">jeżeli ten element "a" prowadzi do zasobu internetowego, który nie został jeszcze przez nas odwiedzony, tekst znajdujący się w zawartości tego elementu "a" będzie koloru czerwonego</a>
      </li>

      <li>
        <a href="#fragment-zawartosci-2">jeżeli ten element "a" prowadzi do zasobu internetowego, który nie został jeszcze przez nas odwiedzony, tekst znajdujący się w zawartości tego elementu "a" będzie koloru czerwonego</a>
      </li>

      <li>
        <a href="#fragment-zawartosci-3">jeżeli ten element "a" prowadzi do zasobu internetowego, który nie został jeszcze przez nas odwiedzony, tekst znajdujący się w zawartości tego elementu "a" będzie koloru czerwonego</a>
      </li>
    </ol>

    <p id="fragment-zawartosci-1">przykładowy zasób internetowy w postaci fragmentu treści o identyfikatorze "fragment-zawartosci-1"</p>
    <p id="fragment-zawartosci-2">przykładowy zasób internetowy w postaci fragmentu treści o identyfikatorze "fragment-zawartosci-2"</p>
    <p id="fragment-zawartosci-3">przykładowy zasób internetowy w postaci fragmentu treści o identyfikatorze "fragment-zawartosci-3"</p>

  </body>
</html>

Rezultat

Interpretacja selektora :link

Firefox

tak

Google Chrome

tak

Safari

tak

Opera

tak

Internet Explorer

tak

Edge

tak