Zoznam v CSS určuje, ako sú obsah alebo položky uvedené určitým spôsobom, t. j. môžu byť usporiadané úhľadne alebo náhodne, čo pomáha pri vytváraní čistej webovej stránky. Pretože sú prispôsobivé a jednoducho sa s nimi manipuluje, možno ich použiť na usporiadanie veľkého množstva materiálu. Predvolený štýl zoznamu je bez okrajov. Zoznam možno rozdeliť do dvoch kategórií:
Nasledujúce vlastnosti zoznamu CSS sú k dispozícii na použitie pri ovládaní zoznamov CSS:
Teraz sa o týchto vlastnostiach dozvieme viac na príkladoch.
Vlastnosť typu štýlu zoznamu
Predvolený typ zoznamu značiek možno zmeniť na rôzne iné typy vrátane štvorca, kruhu, rímskych číslic, latinských písmen a mnohých ďalších. Položky v neutriedenom zozname sú označené okrúhlymi odrážkami (•), zatiaľ čo položky v usporiadanom zozname sú štandardne očíslované arabskými číslicami (1, 2, 3 atď.).
Označenia alebo odrážky sa odstránia, ak ich hodnotu nastavíme na žiadnu.
Syntax:
list-style-type:value;
odinštalovať angular cli
Hodnotu môžeme použiť takto:
- kruh
- desatinné číslo, napr.:1,2,3 atď
- desatinné nuly, napr. :01,02,03,04 atď.
- nižšia rímska
- horný rímsky
- nižšie alfa, napr. a, b, c atď
- horné alfa, napr. A, B, C atď
- námestie
Poznámka: V zozname sú zahrnuté aj predvolené výplne a okraj. Je potrebné pridať padding:0 a margin:0aznačky na odstránenie tohto.
- značky na odstránenie tohto.
Príklad
Tento príklad ukazuje zoznam CSS s niekoľkými typmi a hodnotami v štýle zoznamu nastavenými na štvorec a horné alfa a mnoho.
Example for CSS Lists .num{ list-style-type:decimal; } .alpha{ list-style-type:upper-alpha; } .circle{ list-style-type:circle; } .square{ list-style-type:square; } .disc{ list-style-type:disc; } <h2> Ordered Lists </h2> <ol class="order"> <li>ONE</li> <li>TWO</li> </ol> <h2> Unordered lists </h2> <ul> <li>ONE</li> <li>TWO</li> </ul>
Výkon