attr() CSS

Функция attr() используется для извлечения значения атрибута выбранного элемента и использования его в таблице стилей.

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

Наследуется:
Нет
Анимируется:
Нет
Спецификации:
Поддержка браузерами:

Базовая поддержка:

Can I Use css-gencontent? Data on support for the css-gencontent feature across the major browsers from caniuse.com.

Расширенная поддержка:

Can I Use css3-attr? Data on support for the css3-attr feature across the major browsers from caniuse.com.

Синтаксис

/* Simple usage */
attr(data-count);
attr(title);

/* With type */
attr(src url);
attr(data-count number);
attr(data-width px);

/* With fallback */
attr(data-count number, 0);
attr(src url, '');
attr(data-width px, inherit);
attr(data-something, 'default');

Примеры

HTML

<p data-foo="hello">world</p>

CSS

p::before {
  content: attr(data-foo) " ";
}