Селекторы-псевдоклассы selector:pseudo-class

Селекторы-псевдоклассы link,visited,hover,active

Отображение в браузере:

a:link, a:visited, a:hover, a:active.

Код:

HTML

Селекторы-псевдоклассы link-visited-hover-active HTML

CSS

Селекторы-псевдоклассы link-visited-hover-active CSS

Порядок записи селекторов-псевдоклассов ссылок: link->visited->hover->active.

Селектор-псевдокласс: first-child

Отображение в браузере:

родитель 1:

первый ребенок

второй ребенок

родитель 2:

первый ребенок, но с другим селектором

второй ребенок

третий ребенок

Код:

HTML

Селектор-псевдокласс first-child HTML

CSS

Селектор-псевдокласс first-child CSS

Селектор-псевдокласс: checked

Отображение в браузере:

Мужской
Женский

Код:

HTML

Селектор-псевдокласс checked HTML

CSS

Селектор-псевдокласс checked CSS

Селектор-псевдокласс focus

Отображение в браузере:


Код:

HTML

Селектор focus HTML

CSS

Селектор focus CSS

Селектор-псевдокласс nth-child

Отображение в браузере:

  1. Один
  2. Два
  3. Три
  4. Четыре
  5. Пять

Код:

HTML

Селектор nth-child HTML

CSS

Селектор nth-child CSS