CSS позволяет манипулировать списками лучше, чем стандартные средства HTML. Давайте рассмотрим
основные свойства, предназначенные для форматирования маркеров списков.
list-style-type
Задает маркеры для упорядоченных и неупорядоченных списков. Часто используемые значения приведены
в двух списках ниже, и вы можете увидеть, что получится. Следите за маркерами списка. И не забывайте
про свойство value (оно задает номер, с которого нужно начинать отсчет).
- Нумерация арабскими цифрами ( decimal )
- Прописные буквы англ. алфавита ( upper-latin )
- Строчные буквы англ. алфавита( lower-latin )
- Большие римские цифры ( upper-roman )
- Маленькие римские цифры ( lower-roman )
- Маркер в виде квадратика
- Маркер в виде закрашеннока кружочка
- Маркер в виде незакрашенного кружочка
list-style-image
Задает маркер в виде картинки. Как на главной странице учебника. Записывается это так:
list-style-image: url("расположение_картинки_маркера")
|
Приведем пример:
- Номер 1
- Номер 2
- Номер 3
- Номер 4
- Номер 5
- Номер 6
В принципе, тут все понятно.
list-style-position
Устанавливает позицию маркера в строке списка.
Может принимать два значения: inside (маркер находится внутри области списка)
и outside по умолчанию (маркер находится за пределами области строки списка).
|