CSS :active pseudo-klass

definisjon og bruk

CSS :active pseudoklasser brukes til å velge og sette stiler for elementer som brukeren aktiverer.

:active pseudoklasser brukes oftest til <a> og <button> elementer. Når brukeren klikker på en lenke, aktiveres den; dette gjelder også for knapper.

Tips:Bruk :link Sett stiler for lenker til ikke-besøkte sider ved bruk av :visited Sett stiler for lenker til besøkte sider ved bruk av :hover Sett stiler for lenker ved musepekeroverføring.

Bemerk:I CSS-definisjoner:active Må plasseres :hovermå være etter (hvis det finnes) før det kan virke!

Eksempel

Eksempel 1

Velg og sett stiler for aktive lenker：

a:active {
  background-color: yellow;
}

Prøv selv

Eksempel 2

Velg og sett stiler for <button> når det blir klikket：

button:active {
  background-color: pink;
}

Prøv selv

Eksempel 3

Velg og sett stiler for <p>、<h1> og <a>-elementer når de blir klikket：

p:active, h1:active, a:active {
  background-color: yellow;
}

Prøv selv

Eksempel 4

Velg og sett stiler for ikke-besøkte, besøkte, musepeker og aktive lenker：

/* Ikke besøkte lenker */
a:link {
  color: green;
}
/* Besøkte lenker */
a:visited {
  color: green;
}
/* Lenker med musepeker */
a:hover {
  color: red;
}
/* Aktive lenker */
a:active {
  color: yellow;
}

Prøv selv

Eksempel 5

Sett forskjellige stiler for lenker：

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

Prøv selv

CSS syntaks

:active {
  css deklarasjoner;
}

Teknisk detalj

Nettleserstøtte

Tallene i tabellen angiver den første nettleserversjon som fullt ut støtter denne pseudoklassen.

relaterede sider

教程：CSS links

教程：CSS knapper

教程：CSS pseudoklasser