12.2. Свойство 'content'.

'content' 
Тип значения:       [ <string> | <uri> | <counter> | attr(X) | 
                    open-quote | close-quote | no-open-quote | no-close-quote ]+ | 
                    inherit
Начальная величина: пустая строка
Применяется:        к псевдо-элементам :before и :after
Наследование:       нет
Процентная база:    нет 
Медиа:              все

Это свойство используется с псевдо-элементами :before и :after для формирования содержания в документе. Свойство имеет следующие значения:

<string>

Содержание текста (смотрите раздел по строкам).

<uri>

Значение является адресом URI, который описывает внешний источник. Если устройство вывода не может поддерживать этот ресурс из-за типа медиа-устройства, то оно должено игнорировать этот ресурс. Обратите внимание. CSS2 не предлагают механизм для изменения размера вложенного объекта или для текстового описания, подобно атрибутам "alt" или "longdesc" для изображений в HTML. Это, возможно, измениться в следующих версиях CSS.

<counter>

Счетчики могут определяться двумя различными функциями: 'counter()' или 'counters()'. Первая имеет две формы: 'counter(name)' или 'counter(name, style)'. Сгенерированный текст является значением названного счетчика в этой точке форматирующейся структуры; он форматируется с указанным стилем (по умолчанию 'decimal'). Последняя функция тоже имеет две формы: 'counter(name, string)' или 'counter(name, string, style)'. Сгенерированный текст является значением всех счетчиков с данным именем в этой точке форматирующейся структуры, разделенной определенной строкой. Счетчики интерпретируются с указанным стилем (по умолчанию 'decimal'). Смотрите раздел по автоматическим счетчикам и нумерации для получения подробной информации.

open-quote и close-quote

Эти значения замещают соответствующие строки из свойства 'quotes'.

no-open-quote и no-close-quote

Ничего не вставляется (т.е. вставляется пустая строка), но увеличивается (уменьшается) уровень вложенных кавычек.

attr(X)

Эта функция возвращает значение атрибута Х как строку для субъекта селектора. Строка не анализируется процессором CSS. Если субъект селектора не имеет атрибута X, то возвращается пустая строка. Чувствительность имен к регистру атрибута зависит от языка документа. Обратите внимание. В CSS2 не возможно ссылаться на значения атрибута для других элементов селектора.

Свойство 'display' контролирует, размещается ли содержание в блочном, внутристрочном блоке или в блоке с маркерами.

Авторам следует размещать объявления 'content' в правилах @media, когда содержание чувствительно к медиа-устройствам. Например, текст с буквами может использоваться для любой группы медиа, но изображения применяются только для медиа-группы visual + bitmap, а звуковые файлы применяются только для звуковых медиа-групп.

Следующее правило приводит к тому, что звуковой файл воспроизводится с после цитаты (смотрите раздел по звуковым стилевым таблицам для информации по дополнительным механизмам):

@media aural {
   BLOCKQUOTE:after { content: url("beautiful-music.wav") }
   }

Следующее правило вставляет текст атрибута HTML "alt" перед изображением. Если изображение не выводится на экран, то читатель будет читать текст атрибута "alt".

IMG:before { content: attr(alt) }

Авторы могут включить новые разделители строк в сгенерированное содержание, записывая код "\A" в одной из строк после свойства 'content'. Эта запись вставляет принудительный разрыв строки, подобно элементу BR в HTML. Смотрите разделы "Строки" и "Символы и регистр" для получения подробной информации по коду "\A".

H1:before {
    display: block;
    text-align: center;
    content: "chapter\A hoofdstuk\A chapitre"
}

Сгенерированное содержание не меняет дерево документа. В частности, оно не обращается к процессору языка документа (например, для повторного синтаксического анализа).

Обратите внимание. В следующих версиях CSS свойство 'content' может принять дополнительные значения, позволяющие ему варьировать стиль участков сгенерированного содержания, но в CSS2 все содержание псевдо-элемента :before или :after имеет один и тот же стиль.