Как сделать паузу во время анимации?

Question

[webrapist]

Доброе утро.

Использую @keyframes.

Изначально, при загрузке страницы, элемент должен быть прозрачен на 100% (то есть анимация уже пошла), идёт задержка в несколько секунд и он появляется. Как можно осуществить?

Answer 1

[Danila]

animation-delay: 3s;

Comments

[webrapist]

Где именно прописывать? Если к форматируемому элементу - то идёт задержка ДО начала анимации, т.е. получается, что элемент изначально виден.
Также пробовал прописывать в самом @keyframe - не было реакции.

[Danila]

webrapist:
изначально поставьте элементу opacity: 0;
animation-delay пишите в свойства этого элемента

[Danila]

webrapist: codepen.io/DNLHC/pen/dMrWLw
вот посмотрите

[webrapist]

Данила: странно, что у меня не работало, спасибо.