Иногда обычный маркер заменяют изображением, привлекая для этого свойство list-style-image.
Вот так:
ul li {list-style-image: url(ohio.gif);}
Да, на самом деле все просто. Задайте значение url(), и маркеры будут заменены изображениями. Конечно, имея дело с изображениями, необходимо проявлять осторожность, что совершенно очевидно из примера:
ul li {list-style-image: url(big-ohio.gif);}
В общем случае целесообразно предусмотреть резервный тип маркеров. Они вступят в дело, если основное изображение не загружается, повреждено или его формат таков, что отображается не всеми агентами пользователя. Это можно сделать, объявив для списка запасной list-style-type:
ul li {list-style-image: url(ohio.png); list-style-type: square;}
Кроме того, свойству list-style-image можно присвоить применяемое по умолчанию значение none. Идея правильная, потому что свойство list-style-image наследуется, т. е. в любых вложенных списках в качестве маркера будет выступать одно и то же изображение, если только не отменить такое поведение явно:
ul {list-style-image: url(ohio.gif); list-style-type: square;}
ul ul {list-style-image: none;}
Вложенный список наследует тип элемента square, при этом указано, что в качестве маркеров не могут выступать изображения, поэтому во вложенном списке роль маркеров играют квадраты. Помните, что такой сценарий может не заработать в реальной жизни: если агент пользователя уже определил list-style-type для ul ul, то значение square не будет унаследовано. Ваш броузер может вести себя иначе.