CSS :link-pseudo-klass

Definition och användning

CSS :link Pseudo-klasser används för att välja och ställa in stilar för obesökta länkar.

Observera::link Pseudo-klasser ställer inte in stilar för besökta länkar.

Tips:Använd :visited Ställ in stilar för besökta sidors länkar, använd :hover Ställ in stilar för länkar vid muspekare över, använd :active Ställ in stilar för länkar vid klick.

Observera:i CSS-definitioner::link Måste placeras :hover!(om det finns) innan det träder i kraft!

Exempel

Exempel 1

Välj och ställ in stilar för obesökta länkar:

a:link {
  background-color: yellow;
}

Prova själv!

Exempel 2

Välj och ställ in stilar för obesökta, besökta, muspekare över och aktiva länkar:

/* Obesökt länk */
a:link {
  color: green;
}
/* Besökt länk */
a:visited {
  color: green;
}
/* Muspekare över länk */
a:hover {
  color: red;
}
/* Aktiv länk */
a:active {
  color: yellow;
}

Prova själv!

Exempel 3

Ställ in olika stilar för länkar:

a.ex1:hover, a.ex1:active {
  color: red;
}
a.ex2:hover, a.ex2:active {
  font-size: 150%;
}

Prova själv!

CSS-syntax

:link {
  css-deklarationer;
}

Tekniska detaljer

Version: CSS1

Webbläsarstöd

Talen i tabellen anger den första webbläsarens version som fullständigt stöder den här pseudo-klassen.

Chrome Edge Firefox Safari Opera
4.0 7.0 2.0 3.1 9.6

Relaterade sidor

Lär dig själv:CSS-länkar

Lär dig själv:CSS-pseudoklasser