| Kosten | Пятница, 06 Декабря 2019, 21:26 | Сообщение 1 |
| Псевдокласс и псевдоэлемент являются селекторами CSS, однако псевдокласс представляет виртуальный класс CSS, тогда как псевдоэлемент представляет виртуальный элемент HTML. Селектор псевдокласса помогает в выборе разных состояний, это одного и того же элемента.
Однако псевдоклассы представляют состояния, что основанные на информации, которая находится за пределами исходного дерева HTML. Псевдоклассы также используются, когда становится трудно выбрать конкретное состояние элемента с помощью простых селекторов, на основе идентификатора, класса, типа и атрибута.
Классы CSS также представляют различные состояния элемента.
Рассмотрим элемент в отключенном состоянии. Дерево HTML не содержит информации, находится ли элемент в отключенном состоянии или нет - браузер сохраняет эту информацию в другом месте. Чтобы выбрать элемент в этом состоянии, используется - :disabled как псевдокласс.
Учтите, что нам нужно выбрать первого дочернего элемента, ГДЕ Первый дочерний элемент присутствует в дереве DOM, однако выбор этого невозможен с помощью простых селекторов CSS. Для этого есть селектор псевдокласса - :first-child.
Некоторые из определенных селекторов псевдоклассов:
- Динамические псевдоклассы, которые выбирают элементы на основе объектов, где не сохранены в дереве DOM - :hover :visted :focus и так далее.
- Языковые псевдоклассы, которые представляют один и тот же элемент, но на другом языке - :lang
- Пользовательский интерфейс заявляет, что представляет один и тот же элемент, но в другом состоянии - :disabled :checked и так далее.
- Структурные псевдоклассы, в которой информации присутствует в дереве DOM, однако их трудно выбрать с помощью простых селекторов - :first-child :nth-child() и так далее.
- Псевдокласс отрицания, представляющий элемент, не имеющий определенного состояния - :not()
Имени псевдокласса всегда предшествует двоеточие - :символ
Псевдо-элемент
В отличие от псевдокласса, где представляет виртуальный класс элемента, псевдоэлемент фактически представляет новый виртуальный элемент, который представляет часть элемента. Псевдоэлемент на самом деле отсутствует в дереве DOM, но выглядит так.
Некоторые из определенных селекторов псевдоэлементов:
Псевдоэлемент, представляющий первую строку элемента - ::first-line
Псевдоэлемент, представляющий сгенерированный контент после или до содержимого элемента - ::after ::before
К имени псевдоэлемента всегда добавляется двойное двоеточие - ::символы.
| | Страна: (RU) |
| |
