게으른 사람들을 위한 CSS 애니메이션 생성기.
CSS 애니메이션
CSS는 JavaScript 또는 Flash를 사용하지 않고 HTML 요소의 애니메이션을 허용합니다.
이 장에서는 다음 속성에 대해 배웁니다.
- @키프레임
- 애니메이션 이름
- 애니메이션 지속 시간
- 애니메이션 지연
- 애니메이션 반복 횟수
- 애니메이션 연출
- 애니메이션 타이밍 기능
- 애니메이션 채우기 모드
- 생기
브라우저별 접두사
일부 구형 브라우저는 애니메이션 속성을 이해하기 위해 특정 접두사(-webkit-)가 필요합니다.
CSS 애니메이션이란 무엇입니까?
애니메이션을 사용하면 요소를 한 스타일에서 다른 스타일로 점진적으로 변경할 수 있습니다.
원하는 만큼 CSS 속성을 원하는 만큼 변경할 수 있습니다.
CSS 애니메이션을 사용하려면 먼저 애니메이션에 대한 몇 가지 키프레임을 지정해야 합니다.
키프레임은 특정 시간에 요소의 스타일을 유지합니다.
@keyframes 규칙
@keyframes 규칙 내에서 CSS 스타일을 지정하면 애니메이션이 특정 시간에 현재 스타일에서 새 스타일로 점차 변경됩니다.
