예시 위처럼 이번에 참여한 프로젝트에서 만든 애니메이션바에 대해 포스팅을 해보겠습니다. 애니메이션바는 keyframe을 이용해서 만듭니다! 여기서 keyframe이란? CSS 애니메이션 과정의 중간 절차를 제어할 수 있게 하는 속성 0~100% 형태 @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } from-to 형태 @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } keyframe을 사용하기 위해서는 다음과 같이 3가지가 필요합니다. animation-name : 사용자가 직접 지정한 이름 stage : from - to 로 0~100% 의 구간 CSS 스타일 : 각 스테이지(구간)..