css властивість list-style-type


Властивість list-style-type визначає вигляд мітки кожного елемента списку.

Властивість `list-style-type`

Ця властивість працює тільки тоді, коли значення властивості list-style-image встановлено як none (без задання).

Властивість list-style-type можна використовувати в будь-якому елементі списку. Елемент списку - це будь-який елемент, у якого display встановлено як list-item або inline-list-item, який є нащадком елементів <ol> i <ul>.

Ви можете вказати стиль списку стилів як один з попередньо визначених стилів (наприклад, диск, квадрат, римські цифри тощо) або ви можете використовувати свій власний стиль лічильника, створений за допомогою ліцензії правила @counter-style at-rule, а потім посилатися на цей стиль, просто додавши, його ім'я як значення для стилю списку.

Ви також можете вказати рядок як значення (рядок стає маркером) або використовувати функцію symbols().

Колір маркера буде таким самим, як і колір елемента, до якого він застосовується.

Нотатка:

Маркованому (<ul>) та нумерованому (<ol>) списку відповідаються свої мітки.

Синтаксис

list-style-type: value;

Властивість list-style-type може отримувати 22 значення:

decimal-leading-zero

Арабські цифри з нулем на початку (01, 02, 03). Нулі буде встановлений для чисел менше 10.

georgian

Традиційна грузинська нумерація

lower-alpha

Малі латинські літери

lower-greek

Малі грецькі літери

lower-latin

Малі латинські літери

lower-roman

Малі римські літери

none

Мтка відсутня.

square

Мітка у вигляді квадрату.

upper-alpha

Прописні латинські літери.

upper-latin

Великі латинські літери

upper-roman

Великі римські літери

initial

Встановлює властивість у значення без задання

inherit

Вказує на спадковість властивості від свого батьківського елемента.

hebrew

Іврит нумерація.

hiragana

Хірагана нумерація.

hiragana-iroha

Хірагана-іроха нумерація.

katakana

Катакана нумерація.

katakana-iroha

Катакана-іроха нумерація.

disc

Мітка у вигляді заповненого кола. Без задання.

armenian

Традиційна армянська нумерація

circle

Мітка у вигляді пустого кола.

decimal

Арабські числа

Значення без задання: disc (для <ul>); decimal (для <ol>)
Наслідує: Так
Анімується: Ні
JavaScript синтаксис: object.style.listStyleType="square"

Переглядачі

Переглядач
list-style-type

1.0

4.0

1.0

1.0

7.0

12.0

Переглядач
list-style-type

1.0

1.0

1.0


Мобільних переглядачів ще не додано.

Приклади


Значення у дії

Приклад використання

Встановлення різних міток.

ul.circle {


  list-style-type: circle;


} 





ul.square {


  list-style-type: square;


} 





ol.upper-roman {


  list-style-type: upper-roman;


} 





ol.lower-alpha {


  list-style-type: lower-alpha;


}

Додаткові посилання