Beágyazott számozás - WEBFEJLESZTÉS, WEBÁRUHÁZ KÉSZÍTÉS

Beágyazott számozás

A felsorolás minden szintjéhez egy-egy számlálót rendelve több szintű számozással jeleníthetjük meg, a nyomtatott könyvek tartalomjegyzékében megszokott módon.

A számlálók és a :before álelem kijelölő használatát a CSS3 kijelölők fejezetben már megismertük.

Többszintű számozásnál minden gyermekelem automatikusan egy újabb számlálót hoz létre, így nem kell az egymásba ágyazott listák minden szintjéhez újabb számláló nevet hozzárendelni.

1. Példa:

Forráskód


<style>
  ol {counter-reset:ct;
  list-style-type: none; }
  li:before {
  counter-increment:ct;
  content: counters(ct, ".") " ";}
</style>     
….
<body> 
  <ol><li>li</li>   
    <li>li
       <ol>  
         <li>li</li><li>li 
           <ol>
             <li>li</li><li>li</li>
           </ol> 
         </li> 
         <li>li</li> 
        </ol> 
     </li> 
     <li>li</li> 
  </ol> 
</body>

Eredmény*

* Az eredmény megjelenítése az Ön által használt böngészőtől függ.
A példakód külön ablakban is megtekinthető: css_listak_tobbszintu_szamozas_02.html