이야기 정리

자바스크립트 없이 input의 radio 기능을 사용해 간단하게 클릭 애니메이션을 구현할 것이다. 만들어볼 애니메이션은 총 4종류다. 완성 코드는 아래와 같으며, 스크롤을 내리면 나머지 3종도 볼 수 있다. See the Pen Navigation CSS by beren-105 (@beren-105) on CodePen. 0. 기본 레이아웃 기본 레이아웃을 기반으로 4가지를 모두 만들 것이기 때문에 span 태그는 기본적으로 display:none로 두고, 필요할 때만 block으로 사용했다. 보통이라면 label 안에 input을 넣어 코드를 간결하게 적었겠지만, 애니메이션 효과를 만들기 위해 둘을 따로 분리해서 작성했다. 색상 통일을 위해 :root로 기본 색상과 자주 쓰는 transition을 넣어..