Стиль элемента при наведении на него курсора мыши

Описание

Определяет стиль элемента при наведении на него курсора мыши, но при этом элемент еще не активирован, иными словами кнопка мыши не нажата.

Синтаксис

Селектор:hover { ... }

Пример

<!DOCTYPE html>
<html lang='ru'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>Document</title>
</head>
<body>
<style>
#block-h {
width: 100px;
height: 100px;
background-color: rgb(217, 43, 226);
transition: width 0.6s ease-in-out;
}
#block-h:hover {
width: 200px;
}
</style>
<div id='block-h'></div>
</body>
</html>

Читайте также

Свойство backdrop-filter

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

Свойство list-style-image

Указывает адрес изображения, которое служит в качестве маркера списка....

Свойство border-top-style

Устанавливает стиль верхней границы элемента....

Свойство padding-inline-end

Устанавливает расстояние от внутреннего края рамки элемента до воображаемого прямоугольника по строчной оси....