CSS приклад: list-style-position

Коротка інформація

Значення за замовчуваннямзовнішнє
НаслідуєтьсяТак
ЗастосовуєтьсяДо тегів <dd>, <dt>, <li>, <ol> та <ul>, а також до всіх елементів, у яких вказано display: list-item
Посилання на специфікаціюhttp://www.w3.org/TR/CSS21/generate.html#propdef-list-style-position

Версії CSS

CSS 1CSS 2CSS 2.1CSS 3

Опис

Визначає, як буде розміщуватися маркер відносно тексту. Є два значення: зовнішнє - маркер виведений за межі елемента списку та внутрішнє - маркер обтікається текстом.

Синтаксис

list-style-position: inside | outside

Значення

inside
Маркер є частиною текстового блоку і відображається в елементі списку.
outside
Текст вирівнюється за лівим краєм, а маркери розміщуються поза межами текстового блоку.

Об'єктна модель

[window.]document.getElementById("elementID").style.listStylePosition

Браузери

У браузері Internet Explorer 6 при використанні нумерованого списку <ol> та значення inside властивості list-style-position, числа, починаючи з 10, починають перекривати текст списку.

Internet Explorer до версії 7.0 включно не підтримує значення inherit.

Часті запитання

  • Q: Як використовувати list-style-position в CSS?

    A: Властивість list-style-position в CSS використовується для визначення місця відображення маркера списку. Можливі значення: inside (маркер відображається в межах блоку) і outside (маркер відображається поза межами блоку).

  • Q: Як вказати position для маркерів списку внутрішніми в CSS?

    A: Щоб вказати, що маркери списку повинні бути внутрішніми, використовуйте значення 'inside' для властивості list-style-position.

  • Q: Як вказати position для маркерів списку зовнішніми в CSS?

    A: Щоб вказати, що маркери списку повинні бути зовнішніми, використовуйте значення 'outside' для властивості list-style-position.

  • Q: Де використовується list-style-position в CSS?

    A: Властивість list-style-position використовується для керування місцем відображення маркерів списку в HTML-елементах.

  • Q: Чому важливо використовувати правильне значення list-style-position в CSS?

    A: Правильне використання значення list-style-position допомагає краще контролювати вигляд та розміщення маркерів списку на веб-сторінці.