컴포넌트
import styles from "./Todos.module.css";
const Todos = () => {
return (
<div className={styles.maindiv}>
<h1 className={styles.rotation}> 할일</h1>
</div>
);
};
export default Todos;
css
.maindiv {
height: 3rem;
width: 5rem;
}
.rotation {
font-size: 2rem;
text-align: center;
animation: rotation infinite 500ms linear;
}
@keyframes rotation {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
하핫
'CSS > 애니메이션' 카테고리의 다른 글
2. 버튼 누를때마다 animation 동작하게 만들기, with React, useEffect (0) | 2022.12.12 |
---|---|
1. CSS animation 사용하기 with React (0) | 2022.12.12 |
댓글