CSS viittausopas

CSS-ominaisuus

counter() Funktio palauttaa määritetyn laskurin nykyisen arvon merkkijonona.

Luo sivulle laskuri (body-valitsimessa). Lisää laskuriarvo jokaiselle <h2>-elementille ja lisää "Osio X"-teksti jokaisen <h2>-elementin eteen:

body {
  counter-reset: osio;
}
h2::before {
  counter-increment: osio;
  content: "Osio " counter(osio) ": ";
}

Aseta laskurin tyyli:

body {
  counter-reset: osio;
}
h2::before {
  counter-increment: osio;
  content: "Osio " counter(osio, ylempi-roomalainen) ": ";
}

counter(countername, counterstyle)

Arvo	Kuvaus
countername	Välttämätön. Laskurin nimi (samoin kuin counter-reset- ja counter-increment-ominaisuuksissa käytettävät nimet). Huomaa, että nimet erottuvat suurista ja pienistä kirjaimista.
counterstyle	Valinnainen. Laskurin tyyli (voi olla list-style-type -arvo, @counter-style nimi tai symbols() -funktio). Oletusarvo on desimaalinen.

Arvo

Kuvaus

countername

Välttämätön. Laskurin nimi (samoin kuin counter-reset- ja counter-increment-ominaisuuksissa käytettävät nimet).

Huomaa, että nimet erottuvat suurista ja pienistä kirjaimista.

counterstyle

Valinnainen. Laskurin tyyli (voi olla list-style-type -arvo, @counter-style nimi tai symbols() -funktio).

Oletusarvo on desimaalinen.