Перейти к основному содержимому
Об авторе
Проекты
Знания
Знания/CSS/hover-focus-active

Как работают `:hover`, `:focus`, `:active`?

СобеседованиеПсевдоэлементы и псевдоклассы
  • :hover — курсор над элементом (на тач-устройствах "залипает" после tap)
  • :focus — элемент получил фокус (tab, click, программно)
  • :active — элемент в процессе активации (нажатие мыши)
  • Правильный порядок: :link → :visited → :hover → :focus → :active (LVHFA)
  • :focus-visible — фокус только через клавиатуру (без стилей при клике мышью)
  • Главная
  • Об авторе
  • Проекты
  • Знания
Логотип nKolmykov