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..
css
레이아웃 HTML 구조 작성 레이아웃을 조금 더 확실하게 작성하고자 HTML을 수정하겠습니다. 검색 로그인/회원가입 {{{body}}} CSS 작성 css 를 작성하겠습니다. css 작성이 제일 싫어요... @font-face { font-family: "Pretendard-Regular"; src: url("https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff") format("woff"); font-weight: 400; font-style: normal; } *, :after, :before { padding: 0; margin: 0; box-sizing: border-box; } header, ma..