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

Псевдокласс hover задает стили для ссылки, на которую мы навели мышкой. Обычно этот псевдокласс применяется совместно с псевдоклассами link, visited и active.

Порядок их перечисления в CSS при имеет значение: link, visited, hover, active (если его нарушить - будут проблемы!). Мнемоническое правило для запоминания порядка: LoVe HAte.

Совет: состояние hover можно задавать не только ссылкам, но и любым другим элементам (не работало в старых IE).

Совет: часто состояния link и visited объединяют вместе: a:link, a:visited{color: red}.

Совет: для добавления или отмены подчеркивания ссылок следует использовать свойство text-decoration.

Синтаксис

a:hover {
	
}

Примеры

Пример

Непосещенная ссылка будет красного цвета, посещенная - голубого. Если вы наведете на нее мышкой - она станет зеленого цвета, а если нажмете левую кнопку мыши и будете ее удерживать - станет черной (состояние active):

a:link {
	color: red;
}
a:visited {
	color: blue;
}
a:hover {
	color: green;
}
a:active {
	color: black;
}

Результат выполнения кода: