css властивість 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().
Колір маркера буде таким самим, як і колір елемента, до якого він застосовується.
| Нотатка: | Маркованому ( |
Синтаксис
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;
}