Підтримка браузерами для властивості list-style-image
| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS | |
| 6.0+ | 8.0+ | 1.0+ | 3.5+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Коротка інформація
| Значення за замовчуванням | none |
|---|---|
| Наслідується | Так |
| Застосовується | До тегів <dd>, <dt>, <li>, <ol> і <ul>, а також до всіх елементів з властивістю display: list-item |
| Посилання на специфікацію | http://www.w3.org/TR/CSS21/generate.html#propdef-list-style-image |
Опис
Встановлює адресу зображення, яке використовується як маркер списку. Ця властивість успадковується, тому для окремих елементів списку для відновлення маркера використовується значення none.
Синтаксис
list-style-image: none | url('шлях до файлу') | inherit
Значення
- none
- Скасовує зображення як маркер для батьківського елемента.
- url
- Відносний або абсолютний шлях до графічного файлу. Значення можна вказувати в одинарних, подвійних лапках або без них.
- inherit
- Успадковує значення від батька.
Приклад
HTML5CSS2.1IECrOpSaFx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>list-style-image</title>
<style>
ul {
list-style-image: url(images/book.gif);
}
</style>
</head>
<body>
<ul>
<li>Lorem ipsum dolor sit amet</li>
<li>Consectetuer adipiscing elit</li>
<li>Sed diem nonummy nibh euismod</li>
<li>Tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis
enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis
nisl ut aliquip ex ea commodo consequat.</li>
</ul>
</body>
</html>Об'єктна модель
[window.]document.getElementById("elementID").style.listStyleImage
Браузери
У різних браузерах відстань між зображенням і текстом може відрізнятися.
У Internet Explorer до версії 7.0 включно не відображаються маркери, якщо для списку додано властивість float. Також в цьому браузері не підтримується значення inherit.