Свойство content в CSS

вставка пользовательского контента в начале и в конце элемента

Свойство вставляет пользовательский контент в начале и в конце элемента. Используется вместе с псевдоэлементами ::before и ::after.

Примеры

content: open-quote;
content: "•";
content: url("https://site.ru/flowers.png");

Значения

Значение Описание
normal По умолчанию.
Устанавливается как none для псевдоэлементов ::before и ::after.
none Не добавляет содержимое.
counter Добавляет в содержимое значение счетчика.
attr(<атрибут>) Добавляет значение заданного в скобках атрибута.
<строка> Обычная строка с содержимым.
open-quote Добавляет открывающую кавычку.
close-quote Добавляет закрывающую кавычку.
no-open-quote Удаляет из содержимого открывающую кавычку.
no-close-quote Удаляет из содержимого закрывающую кавычку.
no-close-quote Удаляет из содержимого закрывающую кавычку.
url(“<URL-адрес>”) Вставляет в содержимое мультимедиа (изображение, звук, видео).
inherit Наследует значение родительского блока.
initial Устанавливает значение по умолчанию.

Поддержка браузерами

НастольныеМобильные
Chrome
Edge
Firefox
IE
Opera
Safari
Chrome
Firefox
Opera
Safari
Samsung
Android
content
1
12
1
8
4
1
18
4
10.1
1
1.0
1
Alternative text after /
77
79
нет
нет
64
нет
77
нет
55
нет
12.0
77
Element replacement
28
79
63
нет
7
9
28
63
10.1
9
1.5
≤37
url()
1
12
1
8
7
1
18
4
14
1
1.0
37
Поддерживается: Да Нет
Получай полезные материалы удобным способом!
Добавить комментарий