Как изменить вид маркера списка? С помощью CSS допускается устанавливать один из трёх типов маркеров: disc (точка), circle (кружок), square (квадратик). Добавлять эти значения нужно к стилевому свойству list-style-type, которое указывается для селектора ul или li ul { list-style-type: square; /* Квадратные маркеры */ } Использование псевдоэлемента ::before Выбор и установка собственного символа маркера происходит через псевдоэлемент ::before. Вначале следует вообще убрать маркеры у списка, присвоив значение none стилевому свойству list-style-type, а затем добавить псевдоэлемент ::before к селектору li. Сам вывод символа осуществляется с помощью свойства content, в качестве значения которого и выступает желаемый символ li { list-style-type: none; /* Убираем маркеры у списка */ } li::before { content: "►"; /* Маркер списка */ padding-right: 0.5em; /* Расстояние от маркера до текста */ } Использование псевдоэлемента ::marker Псевдоэлемент ::marker позволяет управлять настройками маркера списка и работает схожим с ::before образом. При этом убирать исходные маркеры, как это делалось в предыдущем примере, необходимости нет. Для ::marker не работают свойства margin и padding, поэтому для изменения расстояния от маркера до текста свойство padding-left добавляется к селектору li li { padding-left: 0.5em; /* Расстояние от маркера до текста */ } li::marker { content: "►"; /* Маркер списка */ } Подробнее