Псевдоэлементы - это специальные конструкции в CSS, которые позволяют создавать виртуальные элементы и добавлять к ним стили. Псевдоэлементы начинаются со знака двоеточия и указываются после селектора элемента. Они не существуют в DOM, но могут быть использованы для добавления дополнительных эффектов на страницу. Два наиболее часто используемых псевдоэлемента - это ::before и ::after. Псевдоэлемент ::before позволяет добавить контент перед содержимым элемента, а псевдоэлемент ::after - после содержимого...

Псевдоэлементы можно сравнить с виртуальными элементами. Они не существуют в дереве документа, т.е. они создаются с помощью CSS, но их можно обрабатывать и стилизовать как обычные элементы HTML. 2 самых часто используемых псевдоэлемента – это :before и :after. Псевдоэлемент :before добавляет содержимое (например, текст) перед контентом элемента, заданного в селекторе. Обязательным условием при этом является добавления CSS-свойства content. Интересно, что добавленный в псевдоэлемент текст нельзя выделить. h1:before {content: "Вставка перед контентом";} Псевдоэлемент :after также используется для добавления содержимого, но уже после контента элемента, заданного в селекторе...