Siirry sivun sisältöön Avut CSS HTML JavaScript Kotisivu

counter-reset

counter-reset-ominaisuudella alustetaan laskureita. Ominaisuudelle voidaan antaa arvoksi:

DOM-viittaus: olio.style.counterReset

Esimerkki

Esimerkin vuoksi tämän sivun kolme luetteloa on alustettu laskureiksi ja niiden arvot on pyydetty esiin seuraavilla tyylisäännöillä:

ul {
/*Luetteloiden alustus (=0)
  jokaisen luettelon (ul) alussa:*/
counter-reset:luettelot;
/*Oletusluettelomerkit pois:*/
list-style-type:none;
}
li {
/*Kasvatetaan laskuria jokaisen luetteloalkion
 (li) kohdalla oletusarvolla (+1):*/
counter-increment:luettelot;
}
/*Luodaan näennäiselementti ennen luetteloalkiota:*/
li:before {
/*Lisätään näennäiselementin sisällöksi
  laskurin arvo ja sitä seuraava merkkijono:*/
content:counter(luettelot) ") ";
/*Esimerkin vuoksi vielä näennäiselementille
  eri tyylejä kuin luetteloalkioille:*/
color:red;
font-family:monospace;
}

Huomiot

Lisätietoja englanniksi

CSS 2.1 -ominaisuusreferenssi | CSS 2.1 -sekalaiset ominaisuudet