Маркированный список
Как сделать, чтобы цвет маркеров в списке отличался от цвета текста?
Существует два способа изменения цвета маркеров, условно назовем их простой и хитрый. Простой метод состоит в том, что внутрь контейнера <li> вкладываем тег <span>, а уже внутрь него помещаем текст. Иными словами вместо традиционной схемы <li>текст</li> создаем конструкцию <li><span>текст</span></li>. При этом цвет маркеров определяется стилевым свойством color для селектора LI, а цвет текста — для селектора SPAN.
Как убрать маркеры в маркированном списке?
Для этой цели применяется стилевое свойство list-style-type со значением none. Его следует добавить к селектору UL или LI.
Как вместо символа маркера использовать картинку?
Чтобы задать свой рисунок маркера, воспользуйтесь стилевым свойством list-style-image, в качестве значения которого указывается url, а в скобках — путь к желаемому изображению.
Хочу изменить вид маркера на другой символ. Как это сделать?
С помощью HTML или CSS допускается устанавливать один из трех типов маркеров: disc (точка), circle (кружок), square (квадрат). Добавлять эти значения нужно к стилевому свойству list-style-type, которое указывается для селектора UL или LI.
Как увеличить расстояние от маркера до текста?
Для изменения расстояния между маркером списка и текстом используйте свойство padding-left для селектора LI.
Как изменить отступ слева от маркеров списка?
Добавьте свойство margin-left к селектору UL или OL, соответственно, для маркированного или нумерованного списка. Браузер Firefox, Safari и Chrome одновременно с отступами добавляет к списку поля (свойство padding), поэтому для одинакового отображения списка в разных браузерах необходимо обнулить значение padding.
Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.
