content
Оновлено: 08.12.2022
content
Властивість content дає змогу вставляти вміст, що генерується, у текст веб-сторінки, який спочатку в тексті відсутній. Застосовується спільно з псевдоелементами ::after и ::before, вони відповідно вказують відображати новий вміст після або до вмісту елемента, до якого додаються.
Коротка інформація
Значення за замовчуванням | normal |
Успадковується | Ні |
Застосовується | До псевдоелементів ::before и ::after |
Анімується | Ні |
Синтаксис
content: <строка> | attr(<атрибут>) | open-quote | close-quote
| no-open-quote | no-close-quote | url | counter | normal | none
Значення
<рядок> | Текст, який додається на веб-сторінку, рядок при цьому має братися в подвійні або одинарні лапки. Допускається використовувати юнікод для вставки спецсимволів. Спецсимволи HTML, які починаються з амперсанду (§ наприклад), відображатимуться як є, тобто простим текстом (§, а не §). |
attr(<атрибут>) | Повертає рядок, який є значенням атрибута тега зазначеного в дужках. Наприклад, a::after {content:attr(href)} додасть після посилання його адресу, тобто значення атрибута href. Якщо зазначеного атрибута немає, то повернеться порожній рядок. |
open-quote | Вставляє відкриваючу лапку, тип якої встановлюється за допомогою стильової властивості quotes. |
close-quote | Вставляє закриваючу лапку. |
no-open-quote | Скасовує додавання відкриваючої лапки. |
no-close-quote | Скасовує додавання закриваючої лапки. |
url | Абсолютна або відносна адреса об'єкта, що вставляється. Якщо вказаний файл браузер не може відобразити, то значення ігнорується. |
counter | Виводить значення лічильника, заданого властивістю counter-reset. |
none | Не додає жодного вмісту. |
normal | Задається як none для псевдоелементів ::before і ::after. |
Приклад
Об'єктна модель
Об'єкт.style.content
Примітка
Firefox до версії 2.0 включно та Opera до версії 9.2 включно не підтримують значення none. Safari до версії 3.1 не підтримує значення none і normal.
Chrome і Safari підтримують властивість quotes для додавання лапок з версії 11 і 5.1 відповідно.