Junior
69
questionbank

Что такое псевдоэлемент?

Получайте ответы на вопросы в реальном времени с Sobes Copilot
Ответ от нейросети sobes.tech

Псевдоэлемент в CSS — это ключевое слово, добавляемое к селектору, которое позволяет стилизовать определенную часть элемента без явного создания дополнительных доминирующих элементов.

Наиболее часто используемые псевдоэлементы:

  • ::before: Вставляет сгенерированное содержимое перед содержимым выбранного элемента.
  • ::after: Вставляет сгенерированное содержимое после содержимого выбранного элемента.
  • ::first-line: Применяет стили к первой строке блочного элемента.
  • ::first-letter: Применяет стили к первой букве блочного элемента.
  • ::selection: Применяет стили к части элемента, выбранной пользователем (например, при выделении текста мышью).
  • ::placeholder: Применяет стили к тексту-заполнителю в полях ввода <input> или <textarea>.

Пример использования ::before и ::after:

css

Пример использования ::first-line и ::first-letter:

css

Псевдоэлементы полезны для добавления декоративных элементов, генерации контента, стилизации частей текста и других задач, упрощая HTML-структуру. Исторически они начинались с одного двоеточия (:), но спецификация CSS3 ввела два двоеточия (::) для различения псевдоклассов (:hover, :focus) и псевдоэлементов, хотя один символ двоеточия для совместимости до сих пор поддерживается большинством браузеров для старых псевдоэлементов. Рекомендуется использовать ::.