С помощью псевдоэлементов :before и :after разработчики задают стиль и местоположение генерируемого содержимого. Как следует из названия, псевдоэлементы :before и :after определяют его местоположение перед и после содержимого элемента, принадлежащего дереву документа соответственно. В сочетании с этими псевдоэлементами свойство 'content' определяет содержимое вставляемого объекта.
Например, следующее правило вставляет строку "Примечание: " перед содержимым каждого элемента P, значение атрибута "class" которого равно "note":
Гиперссылка с классом р1
Гиперссылка с классом р2
Гиперссылка без класса
Гиперссылка с классом р2
Разозлилася старуха зима: задумала она всякое дыхание со света сжить. Прежде всего стала она до птиц добираться: надоели ей они своим криком и писком. Подула зима холодом, посорвала листья с лесов и дубрав и разметала их по дорогам. Некуда птицам деваться: стали они стайками собираться, думушку думать. Собрались, покричали и полетели за высокие горы, за синие моря, в теплые страны. Остался воробей, и тот под стрехузабился.