CSS свойство transition-duration

Свойство transition-duration устанавливает продолжительность анимации перехода в секундах (s) или миллисекундах (ms).

Можно через запятую указывать более одной продолжительности эффекта перехода. Каждая новая продолжительность применяется к соответствующему свойству в том порядке, который определён в свойстве transition-property. Если список продолжительности меньше, чем количество свойств в transition-property, продолжительность эффекта перехода для оставшихся свойств пойдёт по второму кругу. Если список продолжительности больше, чем указано свойств, то список продолжительности просто усекается до нужного количества.

CSS синтаксис

transition-duration: время | initial | inherit;

Возможные значения

ЗначениеОписание
времяУстанавливает продолжительность анимации перехода в секундах (s) или миллисекундах (ms).
inheritЗначение наследуется от родительского элемента.
initialУстанавливает значение по умолчанию.

Пример использования

Установим длительность эффекта перехода 5 секунд


div {
    -webkit-transition-duration: 5s; /* Safari */
    transition-duration: 5s;
}