Псевдоэлемент в CSS — это ключевое слово, добавляемое к селектору, которое позволяет стилизовать определенную часть элемента без явного создания дополнительных доминирующих элементов.
Наиболее часто используемые псевдоэлементы:
::before: Вставляет сгенерированное содержимое перед содержимым выбранного элемента.::after: Вставляет сгенерированное содержимое после содержимого выбранного элемента.::first-line: Применяет стили к первой строке блочного элемента.::first-letter: Применяет стили к первой букве блочного элемента.::selection: Применяет стили к части элемента, выбранной пользователем (например, при выделении текста мышью).::placeholder: Применяет стили к тексту-заполнителю в полях ввода <input> или <textarea>.Пример использования ::before и ::after:
css
Пример использования ::first-line и ::first-letter:
css
Псевдоэлементы полезны для добавления декоративных элементов, генерации контента, стилизации частей текста и других задач, упрощая HTML-структуру. Исторически они начинались с одного двоеточия (:), но спецификация CSS3 ввела два двоеточия (::) для различения псевдоклассов (:hover, :focus) и псевдоэлементов, хотя один символ двоеточия для совместимости до сих пор поддерживается большинством браузеров для старых псевдоэлементов. Рекомендуется использовать ::.