Псевдоклассы

Вы наверняка замечали, что некоторые элементы меняются, когда наводишь на них указатель мыши: кнопка темнеет, ссылка меняет цвет. Это делается с помощью псевдоклассов.

Псевдокласс выбирает элементы в определённом состоянии. Он начинается с двоеточия и обычно пишется сразу после другого селектора. Псевдокласс :hover выбирает элемент, пока над ним находится указатель мыши:

li:hover {
	color: purple;
}

С этим правилом элемент списка становится фиолетовым, когда вы наводите на него указатель, и возвращает прежний цвет, когда вы убираете указатель. :hover можно добавить к любому селектору, например h2:hover или #breeds:hover.

Помните, что на телефонах и планшетах нет указателя мыши, поэтому ничего важного не должно быть видно только при наведении.