CSS+-+Листи


 * Претходно: ** CSS - Врски ** Почеток: ** CSS Туторијал ** Следно: ** CSS - Табели

Листи
Во HTML, постојат два типови на листи:


 * неподредени листи - елементите на листата се маркирани со знаци за подредување
 * подредени листи - елементите на листата се маркирани со броеви или букви

Со CSS, листите може да бидат дизајнирани, и сликите може да се користат како маркери за елементите.

Различни маркери за елементите на листите
Типот на маркер на елементите во листата е дефиниран со list-style-type својството:

ul.a {list-style-type: circle;} ul.b {list-style-type: square;}

ol.c {list-style-type: upper-roman;}

ol.d {list-style-type: lower-alpha;}



Некои од вредностите се за неподредените листи, а некое за подредените листи.

**Слика како маркер**

За да дефинирате слика како маркер за елементот, користете го својството list-style-image:

ul { list-style-image: url('sqpurple.gif'); }

Примерот погоре не се прикажува исто во сите пребарувачи. Internet Explorer и Opera маркерот со слика ќе го прикажат малку поголем спрема Chrome, FIrefox и Safari.

**Листи - својство стенографија**

Истотака можно е да се дефинираат сите својства на листите во едно, единствено својство. Ова се вика стенографско својство, тоа е list-style својството:

ul

{ list-style: square url("sqpurple.gif"); }

Кога се користи ова својство, редоследот на вредностите е:
 * list-style-type
 * list-style-position
 * list-style-image

Не е важно ако една од вредностите недостасува, се додека останатите се во дефинираниот редослед.

Сите својства за листите

 * ** Својство ** || ** Опис ** ||
 * list-style || Поставување на сите својства во една декларација ||
 * list-style-image || Дефинирање на слика како маркер на елементот во листата ||
 * list-style-position || Дефинирање на позицијата на маркерот ||
 * list-style-type || Дефинирање на типот на маркерот на листата ||


 * Претходно: ** CSS - Врски ** Почеток: ** CSS Туторијал ** Следно: ** CSS - Табели