728x90
animation은 각 애니메이션 제어 속성의 단축 속성
animation: 애니메이션이름 지속시간 대기시간? 타이밍함수? 반복횟수? 반복방향? 전후상태? 재생/정지?;
값 | 의미 | 기본값 |
animation-name | @keyframes의 이름 | none |
animation-duration | 지속 시간 | 0s |
animation-delay | 대기 시간 | 0s |
animation-timing-function | 타이밍 함수 | ease |
animation-iteration-count | 반복 횟수 | 1 |
animation-direction | 반복 방향 | normal |
animation-fill-mode | 전후 상태 | none |
animation-play-state | 재생과 정지 | running |
CSS Animation 완벽 가이드 | HEROPY.DEV
CSS Animation 완벽 가이드
CSS Animation(애니메이션)은 여러 CSS 스타일 속성으로 요소의 크기, 색상, 모양 등을 제어해 애니메이션 효과를 부여하는 기술로 자바스크립트 없이도 요소에 동적 효과를 부여할 수 있어, 보다 좋
www.heropy.dev
728x90
'📦 CSS > CSS' 카테고리의 다른 글
[CSS] calc() (0) | 2025.04.14 |
---|---|
[CSS] z-index (0) | 2025.04.14 |
[CSS] var() (0) | 2025.04.14 |
[CSS] Float (0) | 2023.01.25 |
[CSS] 레이아웃 (0) | 2023.01.24 |