Свойство list-style-type позволяет указать маркер. Используется только в случае, когда list-style-image установлен в none.
Возможные значения:
none — без маркера
Маркированный список
circle — кружок.
disc — точка
square — квадрат
Нумерованный список
armenian — армянская нумерация
decimal — Арабские числа (1, 2, 3, 4, 5, …).
decimal-leading-zero — Арабские числа с нулем впереди, если число меньше десяти (01, 02, 03,…).
georgian — традиционная грузинская нумерация.
lower-alpha — маленькие (строчные) латинские буквы (a, b, c, d,…).
lower-greek — строчные греческие буквы (α, β, γ, δ,…).
lower-latin — маленькие (строчные) латинские буквы (a, b, c, d,…).
lower-roman — маленькие (строчные) римские числа (i, ii, iii, iv, v,…).
upper-alpha — Прописные латинские буквы (A, B, C, D,…).
upper-latin — Прописные латинские буквы (A, B, C, D,…).
upper-roman — Прописные римские числа (I, II, III, IV, V,…).
Значение по умолчанию:
disc для неупорядоченного списка,
decimal для упорядоченного списка.
Наследуется: Да
Пример:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
<!DOCTYPE html> <html> <head> <title>CSS list-style-type</title> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <style> ul { list-style-type : square; } ol { list-style-type : upper-roman; } </style> </head> <body> <ul> <li>Собака</li> <li>Кошка</li> <li>Суслик</li> <li>Горностай</li> </ul> <ol> <li>Начальная школа</li> <li>Средняя школа</li> <li>Старшая школа</li> </ol> <p> <a href="https://urvanov.ru/2016/02/18/css-list-style-type/">CSS list-style-type</a> </p> </body> </html> |