Seznam v CSS določa, kako so vsebine ali elementi navedeni na določen način, tj. lahko so razporejeni lepo ali naključno, kar pomaga pri ustvarjanju čiste spletne strani. Ker so prilagodljivi in ​​enostavni za rokovanje, jih je mogoče uporabiti za organiziranje velikih količin gradiva. Privzeti slog seznama je brez robov. Seznam lahko razdelimo v dve kategoriji:

Neurejen seznam:Privzeto so elementi seznama na neurejenih seznamih označeni z oznakami, ki so drobni črni krogci.Urejen seznam:Elementi seznama v urejenih seznamih so označeni s številkami in črkami.

Naslednje lastnosti seznamov CSS so na voljo za uporabo pri nadzoru seznamov CSS:

Vrsta sloga seznama:Ta lastnost se uporablja za določanje videza označevalca elementov seznama, kot je disk, znak ali slog števca po meri.Slika v slogu seznama:S tem parametrom lahko določite slike, ki bodo služile kot oznake elementov seznama.Pozicija sloga seznama:Opisuje, kje naj bo označevalno polje glede glavnega bloka.Slog seznama:Slog seznama je konfiguriran s tem atributom.

Zdaj bomo s primeri izvedeli več o teh značilnostih.

Lastnost tipa sloga seznama

Privzeto vrsto seznama označevalcev je mogoče spremeniti v številne druge vrste, vključno s kvadratom, krogom, rimskimi številkami, latiničnimi črkami in številnimi drugimi. Vnosi v neurejenem seznamu so označeni z okroglimi točkami (•), medtem ko so elementi v urejenem seznamu privzeto oštevilčeni z arabskimi številkami (1, 2, 3 itd.).

Oznake ali oznake bodo odstranjene, če njihovo vrednost nastavimo na nič.

Sintaksa:

list-style-type:value;

linux $home

Vrednost lahko uporabimo na naslednji način:

1. krog
2. decimalno, npr.:1,2,3 itd
3. decimalne-začetne-ničele, npr.:01,02,03,04 itd.
4. spodnje-rim
5. zgornjerim
6. nižja alfa, npr. a,b,c itd
7. zgornja alfa, npr. A, B, C itd
8. kvadrat

Opomba: Na seznamu sta vključena tudi privzeti odmik in rob. Dodati je treba padding:0 in margin:0

in
oznake za odpravo tega.

Primer

Ta primer prikazuje seznam CSS z več vrstami slogov seznama in vrednostmi, nastavljenimi na kvadrat in zgornjo alfa ter veliko.

 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> 

Izhod