CSS Siyahı xüsusiyyətləri

Siyahı xüsusiyyəti əvəllər siyahı hazırlamaq məqsədilə istifadə edilsə də indilərdə menyu hazırlanmasında istifadəsi daha çoxdur. Bu dərslikdə siyahı xüsusiyyətləri ilə yanaşı display və white-space xüsusiyyətlərindən də bəhs ediləcək.

list-style
list-style-type
list-style-image
list-style-position
white-space
display
 
list-style-type
Quruluşu: list-style-type: <dəyər>
Aldığı dəyərlər: disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none
Başlanğıc dəyəri: disc
Tətbiq oluna bilən elementlər: display dəyəri list-item olan elementlər
İrsilik: Var
list-style-type xüsusiyyəti list-item işarəsinin tipini təyin edir. list-style-images xüsusiyyəti none dəyəri aldıqda və ya şəkil göstərilməyən hallarda istifadə edilir.
ul.maşınlar {
list-style-type: none
}

ol ol ol {
list-style-type: lower-roman /* rum - i ii iii iv v kimi */
}
 
list-style-image
Quruluşu: list-style-image: <dəyər>
Aldığı dəyərlər: <url> | none
Başlanğıc dəyəri: none
Tətbiq oluna bilən elementlər: display dəyəri list-item olan elementlər
İrsilik: Var
list-style-image xüsusiyyəti list-style işarəsinin yerinə şəkil qoymaq üçün istifadə edilir
ul{
list-style-image: url(mavitop.gif)
}
 
list-style-position
Quruluşu: list-style-position: <dəyər>
Aldığı dəyərlər: inside | outside
Başlanğıc dəyəri: outside
Tətbiq oluna bilən elementlər: Bütün elementlər
İrsilik: Var
list-style-position xüsusiyyəti list-item işarələrinin mətnin içindən (inside) və ya soldan xaricində (outside) olacağını təyin edir.
ul{
list-style-position: inside
}
 
list-style
Quruluşu: list-style: <dəyər>
Aldığı dəyərlər: <list-style-type> |<list-style-position> | <url>
Başlanğıc dəyəri: 0
Tətbiq oluna bilən elementlər: display dəyəri list-item olan elementlər
İrsilik: Var
list-style xüsusiyyəti list-style-type, list-style-position və list-style-image xüsusiyyətlərinin qısa yoludur.
ul{
list-style: disc outside
}

ol{
list-style: decimal inside
}
 
white-space
Quruluşu: white-space: <dəyər>
Aldığı dəyərlər: normal | pre | nowrap
Başlanğıc dəyəri: normal
Tətbiq oluna bilən elementlər: Block-level elementler
İrsilik: Var
white-space xüsusiyyəti elementlərin boşluqlarının necə icra olunacağını təyin edir. normal dəyərində birdən çox boşluğu tək boşluq kimi sayır. pre dəyərində isə birdən çox boşluğu birləşdirmir. nowrap alt sətirə keçişə icazə vermir.
p {
white-space: pre;
}

display
Quruluşu: display: <dəyər>
Aldığı dəyərlər: none | inline | block | inline-block | list-item | run-in | table | inline-table | table-row-group | table-header-group | table-footer-group | table-row | table-column-group | table-column | table-cell | table-caption | inherit
Başlanğıc dəyəri: inline
Tətbiq oluna bilən elementlər: Bütün elementlər
İrsilik: yoxdur
display elementi üçün ən çox istifadə olunan 4 dəyəri nəzədən keçirək. block: elementdən əvvəl və sonra bir sətir buraxır. inline: elementdən əvvəl və sonra bir sətir buraxmır. nowrap: block kimidir, tək fərqi list-item işarəsi əlavə etməsidir. none: element göstərilmir, elementi gizləyir. Bir çox javascript kodlaşdırmasında istifadə edilən xüsusiyyətdir.
p {
display: inline;
}

em {
display: block;
}
CSS3