animation-name

Описание

CSS свойство animation-name задаёт список анимаций, чтобы примененить к элементу. Каждое имя является правилом @keyframes, которое задаёт значения свойств для последовательности анимации.

The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

Часто удобно использовать сокращенное свойство animation для одновременной установки всех свойств анимации.

Синтаксис

/* Single animation */
animation-name: none;
animation-name: test_05;
animation-name: -specific;
animation-name: sliding-vertically;

/* Multiple animations */
animation-name: test1;
animation-name: test1, animation4;
animation-name: none, -moz-specific, sliding;

/* Global values */
animation-name: initial
animation-name: inherit
animation-name: unset

Значения

none

Это специальное ключевое слово, обозначающее отсутствие ключевых кадров. Оно может быть использовано для отключения анимации без изменения порядка других идентификаторов, или для отключения анимации, поступающей из каскада.

<custom-ident>

Строка, идентифицирующая анимацию. Этот индентификатор состоит из комбинации букв без учета регистра от a до z, цифр от 0 до 9, подчеркивания (_), и/или черты (-). Первый символ без черты должен быть буквой (то есть, без цифры в начале, даже если перед ним стоит черта.) Кроме того, две черты запрещены в начале идентификатора. Оно не может быть none, unset, initial, или inherit в любой комбинации случаев.

Формальный синтаксис

[ none | <keyframes-name> ]#
где 
<keyframes-name> = <custom-ident> | <string>

Примеры

См. CSS animations.

Спецификации

Совместимость с браузерами

Смотрите также

• Использование CSS анимации
• AnimationEvent