| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | ||||||
| 2 | 3 | 4 | 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 16 | 17 | 18 | 19 | 20 | 21 | 22 |
| 23 | 24 | 25 | 26 | 27 | 28 | 29 |
| 30 |
Tags
- 상태관리
- JavaScript
- Download
- Package
- vscode
- Chart
- type
- antd
- 이미지
- 시멘틱태그
- error
- form
- axios
- NeXT
- 리액트기초
- TradingVIew
- components
- 프론트엔드개발
- 프론트엔드
- npm
- err
- CSS
- FRONT
- vue-cli-service
- VUE
- 리액트
- frontend
- react
- useState
- develop
Archives
- Today
- Total
목록keyframes (1)
개발쬬
[CSS] class로 페이드 효과 넣어주기 fade-up fade-down
[CSS] 페이드 효과 넣어주기 fade-up fade-down scss up, 이나 down 등 여러가지 애니메이션 효과를 지정해 줄 수 있다. 해당 class 명을 사용해 원하는 곳에 넣어주면 된다..fade { &-up { opacity: 0; animation: fadeUp 1s ease forwards; } &-down{ opacity: 0; animation: fadeDown 1s ease forwards; } } css forwards 설정을 넣어줌으로써 애니메이션 상태가 유지될 수 있도록 해준다..fade-up { opacity: 0; animation: fadeUp 1s ease forwards; } animation keyframes 를 지정한 후 0% - 100% 상태를 변경해준다..
쬬의 CSS
2023. 8. 8. 19:25