CSS animation으로 슬라이드 만들기

animation-fill-mode :

CSS 애니메이션이 실행 전과 후에 대상에 스타일을 적용하는 방법을 지정

none : 아무것도 지정되지 않은 상태  - 기본

forwards : 애니메이션 키프레인이 100%에 도달했을때 마지막 키프레임 유지

backwards : 애니메이션 스타일을 애니메이션이 실제로 시작되기전에 미리 적용

both : forwards, backwards 둘 다 적용

 

animation-timing-function: linear

애니메이션 효과가 처음부터 끝까지 일정한 속도로 진행