keyframes 썸네일형 리스트형 <CSS> @keyframes 애니메이션 나는 처음에 동적으로 움직이는 애니메이션 효과는 스크립트로만 처리를 해줄 수 있는 줄 알았는데 CSS 코드 만으로 충분히 애니매이션 효과가 가능하다. mdn을 뒤져보면 @keyframes slidein { from { margin-left: 100%; width: 300%; } to { margin-left: 0%; width: 100%; } } 이런 식으로 기본적인 정의가 되어있다. 간단히 정리를 하면 slidein 이라는 블록에 애니메이션 효과를 맥이는 것인데 @keyframes 뒤에 본인이 스타일먹일 블록명 from >> 시작할 때의 스타일 to >> 끝났을 떄의 스타일 정도로 기초를 잡고 나도 처음 써봐서 구글링해서 나온 코드를 기반으로 한번 적용된 화면을 보자 See the Pen MWKBRmJ.. 더보기 이전 1 다음