🎨 transition / transform / animation 속성 사용법

CSS 트랜지션 트랜지션(transition)은 CSS 프로퍼티의 값이 변화할 때, 프로퍼티 값의 변화가 일정 시간(duration)에 걸쳐 일어나도록 하는 것이다. 상태 변화에 동반하여 변경되는 CSS 프로퍼티 값에 의한 표시의 변화를 부드럽게 하기 위해 애니메이션 속도를 조절한다. 쉽게 말하자면 요소에 마우스를 올렸을 경우, 색 혹은 크기가 변화하는 설정을 가미했는데, 뚝뚝 바로바로 변화하는 것 보단 부드럽게 전환되는 효과를 지정해 줄 때 사용한다고 보면 된다 transition은 전환되는 모션을 추가로 가미하는 속성이지 그 자체로 스타일을 주는 속성은 아니다. 그래서 :hover와 같은 가상 클래스 선택자(Pseudo-Classes) 또는 JavaScript의 부수적인 액션에 의해 발동한다. 그리고..

인파_

2021.10.19