[Css] - @keyframes , 애니메이션 (animation) 속성

참고 : css 애니메이션 사이트 : https://animista.net/

Animista - CSS Animations on Demand

@keyframes 은 CSS문법 중 하나로 애니메이션이 만들어지는 부분 

키프레임 애니메이션을 정의한 후 요소에 애니를 적용할라면 "aniamtion" 속성을 이용해 키프레임을 연결해야한다

 

From to 형

@keyframes 애니메이션 이름{
	form{
		Transfrom : … … 
	}
	to {
	}
}

스텝형

@keyframes 애니메이션 이름{
	0% {
	
	}
	50% {
	}
	100% {
	}
}

 

사용법

img {
	animation : 애니메이션이름 재생시간 옵션 (infinite : 무한)
}