Русский
Русский
English
Свойства CSS
Статистика
Реклама

list-style-position

Браузер
Internet Explorer
Chrome
Opera
Safari
Firefox
Версия
6.0
7.0
8.0
9.0
2.0
3.0
4.0
5.0
9.2
9.6
10
2.0
3.1
4.0
5.0
2.0
3.0
3.6
4.0
Поддержка
Возможно неправильное отображение
Частичная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Полная поддержка
Краткая информация
CSS CSS1+
Значение по умолчанию outside
Наследуется Да
Применяется К тегам <dd>, <dt>, <li>, <ol> и <ul>, а также ко всем элементам, у которых указано display: list-item
Ссылка на спецификацию открыть в новой вкладке
Описание
Определяет, как будет размещаться маркер относительно текста. Имеется два значения: outside — маркер вынесен за границу элемента списка (рис. 1) и inside — маркер обтекается текстом (рис. 2).
Рис. 1. Значение outside
Рис. 2. Значение inside
Синтаксис
list-style-position: inside | outside
Аргументы
inside - Маркер является частью текстового блока и отображается в элементе списка.
outside - Текст выравнивается по левому краю, а маркеры размещаются за пределами текстового блока.
Пример

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>list-style-position</title>
<style type="text/css">
UL {
list-style-image: url(images/book.gif); /*Путь к рисунку для установки маркера*/
list-style-position: inside; /*Маркер обтекается текстом*/
}
</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.listStylePosition
Браузеры
В браузере Internet Explorer 6 при использовании нумерованного списка <ol> и значения inside свойства list-style-position, числа идущие с 10, начинают накладываться на текст списка.
Internet Explorer до версии 7.0 включительно не поддерживает значение inherit.
Первоисточник - htmlbook.ru Автор - Влад Мержевич
Комментариев (-)
Имя
Электронная почта

Последние комментарии

© 2006-2024, heroes-3.ru