Спецификация CSS2

Если значение свойства 'width' - 'auto', то ширина содержимого бокса маркёра является шириной содержимого, иначе - это значение 'width'. Для значений 'width' меньших, чем ширина содержимого, свойство 'overflow' специфицирует поведение при переполнении. Боксы маркёра могут перекрывать основные боксы. Для значений 'width' больших, чем ширина содержимого, свойство 'text-align' определяет горизонтальное выравнивание содержимого в боксе маркёра.

Свойство 'marker-offset' специфицирует смещение по горизонтали между боксом маркёра и ассоциированным основным боксом. Расстояние измеряется между их ближайшими краями рамок.

Примечание. Если маркёр всплывает вправо от поплавка в содержимом, отформатированном слева направо, то основной бокс будет всплывать вниз от правой стороны поплавка, но боксы маркёра будут появляться слева от поплавка. Поскольку левый край рамки основного бокса расположен слева от поплавка (см. описание поплавков), а бокс маркёра расположен вне края рамки основного бокса, маркёр расположится также слева от поплавка. Аналогичным будет и поведение при форматировании справа налево, когда маркёр всплывёт слева от поплавка.

Если свойство 'display' имеет значение 'marker' для содержимого, генерируемого элементом с 'display: list-item', то бокс маркёра, генерируемый для ':before', замещает нормальный маркёр элемента списка.

В следующем примере содержимое центрируется в боксе маркёра фиксированной ширины. Этот документ:

Выравнивание содержимого в боксе маркёра

1. Это первый элемент списка.
2. Это второй элемент списка.
3. Это третий элемент списка.

должен дать примерно такой вывод:

(1) Это первый элемент списка. (2) Это второй элемент списка. (3) Это третий элемент списка.

В следующем примере создаются маркёры до и после элементов списка.

Этот документ:

Маркёры до и после элементов списка

• первый элемент списка появляется первым
• второй элемент списка появляется вторым

должен дать примерно такой вывод (здесь используется рисунок ascii вместо изображения gif улыбки):

:-) первый элемент списка появляется первым :-( :-) второй элемент списка появляется вторым :-(

В следующем примере маркёры используются для нумерации примечаний (параграфов).

Данный документ:

Маркёры для создания нумерованных примечаний 4

Это первый параграф данного документа.

Это очень короткий документ.

Это конец.

должен дать примерно такой вывод:

Это первый параграф данного документа. Примечание 1: Это очень короткий документ. Это конец.

'marker-offset'

Значение: | auto | inherit

Начальное: auto

Применяется: к элементам с 'display: marker'

Наследуется: нет

Процентное: N/A

Носитель: визуальный

Это свойство специфицирует расстояние между ближайшим краем рамки бокса маркёра и ассоциированным с ним основным боксом. Смещение может или специфицироваться пользователем (), или выбираться ПА ('auto').

Значения размеров могут быть отрицательными, но могут существовать ограничения, в зависимости от специфики реализации.

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

Эта программа HTML и таблица стилей:

Пример маркёров 5

Это большой предшествующий параграф ...

1. Это первый элемент списка.
2. Это второй элемент списка.
3. Это третий элемент списка.

Это большой последующий параграф ...

должен дать примерно такой вывод:

Это большой предшествующий параграф ... i. Это первый элемент списка. ii. Это второй элемент списка. iii. Это третий элемент списка. Это большой последующий параграф ...