5 августа буду в отъезде. отвечаю по возможности

Свойство content

Свойство content позволяет вставлять в теги произвольный генерируемый текст. Применяется совместно с псевдоэлементами after и before.

Синтаксис

селектор::after { content: текст; }
селектор::before { content: текст; }

Пример

Давайте в начало и конец текста тега li вставим дополнительный текст:

<ul> <li>list item</li> <li>list item</li> <li>list item</li> <li>list item</li> <li>list item</li> </ul> li::before { content: '!!!'; } li::after { content: '???'; }

:

Пример

К вставляемому тексту можно применять различные стили. Покрасим, к примеру, этот текст в какой-нибудь цвет:

<ul> <li>list item</li> <li>list item</li> <li>list item</li> <li>list item</li> <li>list item</li> </ul> li::before { color: red; content: '!!!'; } li::after { color: green; content: '???'; }

:

Смотрите также

  • функцию attr,
    которая получает значение атрибута тега
  • свойство counter-increment,
    которое задает автоматическую нумерацию