프론트엔드

See the Pen Untitled by seongtae (@stae1102) on CodePen. CSS에서 애니메이션을 배웠습니다. 로딩창에서 원의 크기가 개별적으로 달라지는 애니메이션을 구현하곤 합니다. 이를 구현하기 위해서는 가상클래스와 keyframes를 사용합니다. 먼저 html입니다. div 안에 span 태그를 3개 넣습니다. 이 span 태그가 원형 도형입니다. 그 다음 핵심인 CSS를 작성합니다. .loading span { display: inline-block; width: 15px; height: 15px; background-color: grey; border-radius: 50%; animation: loading 1s linear infinite; } display: inl..