CSS parametras - counter-increment

Lukas

counter-increment padidina kurio nors skaitiklio (counter) reikšmę. Dažniausiai naudojama kartu su parametru counter-reset, kuris atstato skaitiklio reikšmę į pradinę - 0, bei parametru content, kuris padeda atvaizduoti skaitiklių reikšmes.

Pavyzdys

<html>
<head>
<style type="text/css">

body {
  counter-reset:antrastes_nr;
}
h1 {
  counter-reset:h2_nr;
}
h1:before {
  counter-increment:antrastes_nr;
  content:"Antraštė nr" counter(antrastes_nr) ". ";
}
h2:before {
  counter-increment:h2_nr;
  content:counter(antrastes_nr) "." counter(h2_nr) " ";
}

</style>
</head>
 
<body>
 
<h1>HTML</h1>
  <h2>Pradmenys</h2>
  <h2>Pažengusiems</h2>
  <h2>Žinynas</h2>
 
<h1>CSS</h1>
  <h2>Pradmenys</h2>
  <h2>Stiliai</h2>
  <h2>Pažengusiems</h2>
  <h2>Žinynas</h2>
 
</body>
</html>

Galimos reikšmės

Reikšmė	Aprašymas
none	Joks skaitiklis nebus padidintas.
id skaičius	id nurodo kokį skaitiklį reikia padidinti, skaičius - per kiek vietų didinti ar mažinti reikšmę. Jei skaičius nėra nurodomas, tada reikšmė yra padidinama vienetu. Jei prieš tai tokiu id skaitiklis nebuvo naudojamas, jo pradinė reikšmė tampa 0.
inherit	Elemento stiliai turi būti paveldimi iš tėvinio elemento. Elemento, kuriame yra šis elementas.