CSS laskuri lisää ominaisuus

Määrittely ja käyttö

counter-increment-ominaisuus asettaa valitsimen jokaisen esiintymän laskurin lisäysmäärän. Oletuslisäys on 1.

Selitys

Käyttämällä tätä ominaisuutta laskin voi lisätä (tai vähentää) jota tahansa arvoa, joka voi olla positiivinen tai negatiivinen. Jos number-arvoa ei anneta, oletusarvo on 1.

Huomautus:Jos käytetään "display: none", niin laskuria ei voida lisätä. Jos käytetään "visibility: hidden", niin laskuria voidaan lisätä.

Katso myös:

CSS viittausoppikirja:CSS :before väliaikainen elementti

CSS viittausoppikirja:CSS :after väliaikainen elementti

CSS viittausoppikirja:content ominaisuus

CSS viittausoppikirja:counter-reset ominaisuus

CSS funktio:counter() funktio

HTML DOM viittausoppikirja:counterIncrement ominaisuus

Esimerkki

Numerointitapa, jossa osiin ja aliosiin annetaan numerot (esim. "Section 1", "1.1", "1.2"), on:

body
  {
  counter-reset:section;
  }
h1
  {
  counter-reset:subsection;
  }
h1:before
  {
  content:"Section " counter(section) ". ";
  counter-increment:section;
  }
h2:before
  {
  counter-increment:subsection;
  content:counter(section) "." counter(subsection) ";
  }

Kokeile itse

CSS syntaksi

counter-increment: none|id|initial|inherit;

Ominaisuuden arvo

Arvo Kuvaus
ei Oletus. Valitsimella ei ole laskurilisäystä.
id number

id Määritellään valitsin, id tai luokka, jota lisätään laskuriin.

number Määritellään lisäysarvo. number voi olla positiivinen, nolla tai negatiivinen.
inherit Määritellään, että counter-increment-ominaisuuden arvo pitäisi perittää vanhemmalta elementiltä.

Tekninen yksityiskohta

Oletusarvo: ei
Perintä: ei
Versio: CSS2
JavaScript-kieli: object.style.counterIncrement="subsection"

Selaimen tuki

Taulukossa olevat numerot osoittavat ensimmäisen selaimen version, joka tukee ominaisuutta täysin.

Chrome IE / Edge Firefox Safari Opera
4.0 8.0 2.0 3.1 9.6

Huomautus:Jos on määritelty !DOCTYPE, niin Internet Explorer 8 (ja uudet versiot) tukee counter-increment-ominaisuutta.