Свойство transition-duration
Задает длительность перехода свойств из одного значения в другое
transition-duration: 2s;Пошаговый план! Как быстро научиться создавать сайты!
- поддерживается начиная с
- частичная поддержка до
- не поддерживается
Значения
transition-duration: 1s;
Длительность перехода в указанных единицах. Возможные единицы: s, ms
<style>
.example-1 {
width: 100px;
height: 100px;
background: #fd4d66;
transition: opacity linear;
transition-duration: 1s;
}
.example-1:hover {
opacity: 0.5;
}
</style>
<div class="example-1">Наведи на меня</div>Наведи на меня
transition-duration: 1s, 3s;
Длительность перехода для разных свойств, если их указано несколько в transition-property
<style>
.example-2 {
width: 100px;
height: 100px;
background: #fd4d66;
transition: opacity linear, background linear;
transition-duration: 1s, 3s;
}
.example-2:hover {
opacity: 0.5;
background: #5f77ec;
}
</style>
<div class="example-2">Наведи на меня</div>Наведи на меня