keyframes1 (CSS) animation animation 요소에 적용되는 CSS 스타일을 다른 CSS 스타일로 부드럽게 전환시켜 줄 수 있다 CSS에서 애니메이션 속성으로 동적인 효과를 줄 수 있다 애니메이션의 상태를 나타내는 키프레임들로 구성 @keyframes @keyframes name { 0% {...} n% {...} 100% {...} } → name: 애니메이션 이름 설정 0% : 시작할 때의 모양을 설정. from으로 사용해도 가능 n% : n% 일 때의 모양을 설정 100% : 끝날 때의 모양을 설정. to로 사용해도 가능 트랜지션 효과 보다 훨씬 더 규모가 크고 복잡하지만 다양한 효과를 적용해서 좀 더 정밀하고 원하는 CSS효과를 줄 수 있다 JS를 모르더라도 간단하게 애니메이션을 구상할 수 있다 JS를 이용한 애니메이션이 .. 2023. 1. 11. 이전 1 다음