② Изображения для элементов списка list-style-image

Продолжим изучение темы CSS - списки. Если пропустили прошлую статью, то вот ссылка на неё:

В качестве маркера элементов списка можно использовать изображения и градиентные заливки. Наследуется.

list-style-image

Значения:

url(url) - Путь к изображению.
none - значение по умолчанию, означает отсутствие изображения. Также убирает изображение для элемента из группы элементов с установленным изображением-маркером.
initial - Устанавливает значение свойства в значение по умолчанию.
inherit - Наследует значение свойства от родительского элемента.

Синтаксис

CSS

ul {list-style-image: url("images/romb.png");}
ul {list-style-image: linear-gradient(#FF7A2F 0, #FF7A2F 50%, #FFB214 50%);}

📷 РИС. 2. ОФОРМЛЕНИЕ МАРКИРОВАННОГО СПИСКА С ПОМОЩЬЮ ИЗОБРАЖЕНИЯ

📷 РИС. 3. ОФОРМЛЕНИЕ МАРКИРОВАННОГО СПИСКА С ПОМОЩЬЮ ГРАДИЕНТА

Продолжение в следующей статье!