keyframe1 [리액트] styled-components로 keyframe 구현하기 1. styled-components 설치하기 yarn add styled-components 2. keyframes import하기 import styled, { keyframes } from 'styled-components'; 3. keyframes 애니메이션 만들기 const 애니메이션이름 = keyframes` 0% { /* 애니메이션이 0% 진행했을때 적용할 스타일 */ } 50% { /* 애니메이션이 50% 진행했을때 적용할 스타일 */ } 100% { /* 애니메이션이 100% 진행했을때 적용할 스타일 */ } `; 4. keyframes로 만든 애니메이션을 속성값으로 넣어주기 const Box = styled.div` animation: ${애니메이션이름} 2s; `; 2022. 5. 10. 이전 1 다음
