Mala šola CSS-ja IX.: Številčni in točkovni seznami

Jiga — Wed, 27 Jan 2010 23:27:07 +0000

Številčni in točkovni seznami se ponavadi uporabljajo v sami vsebini. Za številčni seznam uporabljamo značko

, za točkovni pa

. Obema značkama pa sledi značka

in zapis.

Seznami so že naravno oblikovani, če pa želimo nadgraditi obliko pa moramo uporabiti CSS. Če na sami strani uporabljamo več seznamov, moramo biti pozorni na dodeljevanje stilov oziroma je bolje uporabiti dodatne atribute - ID ali class.

Dodatne nastavitve pri seznamih

START – Številčnemu seznamo lahko dodamo tudi značko »start«. Značka nam omogoča, da se lahko seznam začne z poljubno številko; npr.: Če bi uporabili značko start=«10«, bi se naš seznam pričel z številko 10.
TYPE – Slednja značka nam omogoča določitev tipa predznaka oziroma simbola, ki določuje začetek vrstice seznama.

Več informacij: http://www.w3schools.com/TAGS/tag_ol.asp

Prirejeni seznami

S pomočjo CSSja pa lahko tudi seznam priredimo svojim željam. Klasične »bullet« oznake bomo zamenjali s sliko. Zato potrebujemo CSS kodo, ki nam "resetira" seznam nato pa bomo dodelili svojo kodo, ki bo določala novo obliko seznama.

Primer kode:

ul {
margin: 0;
padding: 0;
list-style: none; /*--Odstrani klasične "bullet" značke--*/
}
ul li {
margin: 0;
padding: 5px 5px 5px 15px; /*--Dodamo odmike--*/
background: url(bullet.gif) no-repeat left center; /*--Dodamo "bullet" značko v obliki slike--*/
}

Primer prirejenega seznama in pojasnjeni odmiki.

Pomagalnik » seznami