웹 서칭을 하다 하고싶은걸 발견해서 연습해보았다.
코드는 이렇게 작성되었다.
먼저 그라데이션
/* 그라데이션 */
background: linear-gradient(90deg, #ff9900, #00d9ff);
background-size: 400% 400%;
/* 애니메이션 */
animation: gradientAnimation 10s ease infinite;
text-align: center;
line-height: 30px;
/* 키 프레임 */
@keyframes gradientAnimation {
/* 시작 */
0% {
background-position: 0% 50%;
}
/* 중간 */
50% {
background-position: 100% 50%;
}
/* 원위치 */
100% {
background-position: 0% 50%;
}
}
'개발일지' 카테고리의 다른 글
| 미니프로젝트 A-03 KPT 회고 (0) | 2023.10.12 |
|---|---|
| 2023.10.11. TIL 텍스트 애니메이션 및 반응형 폰트 비율 (0) | 2023.10.11 |
| SQL TIL 4주차 : Subquery, 그 외 (1) | 2023.10.11 |
| SQL TIL 3주차 : Join (0) | 2023.10.11 |
| SQL TIL 2주차 : Group by, Order by (0) | 2023.10.11 |