ohjungho 님의 블로그

CSS에서 애니메이션이란 움직이는(변화하는) 효과를 의미한다. 예를 들어 CSS 애니메이션으로 요소의 스타일(글자 색, 이미지 위치 등)에 변화를 줄 수 있다. CSS에서는 전환, 변형, 키프레임으로 애니메이션을 구현한다. 즉, 내가 만드는 웹, 앱 페이지에 움직임을 줄 수 있다. 전환전환(transition) 은 시간에 따른 상태를 지정하는 애니메이션이다. 대표적인 장점은 형태의 변형을 부드럽게 만들어준다는 점이다. 즉, 부드럽고 점진적인 애니메이션을 만들려면 움직임을 줄 때 전환을 사용해야 한다. 예를 들어서 hover 상태에서 배경색을 바꿀 때 아무 설정이 없다면 색이 갑자기 바뀐다. 하지만 전환을 사용하면 색이 서서히 바뀌면서 사용자에게 더 좋은 경험을 줄 수 있다. 전환에는 2가지의 필수 속성과..