펼침메뉴 썸네일형 리스트형 순수 CSS만으로 아코디언 탭 메뉴 구현하기 See the Pen Pure CSS, Horizontal Arccodion by moksunung (@moksunung) on CodePen. 위 예제는 http://codepen.io 에 작성했습니다. 순수 CSS만을 활용하여 아코디언 메뉴(펼침 텝메뉴) 만들기. * 원리 설명 1. 같은 name으로 묶인 radio 타입의 input은 그 인풋들 중 단 하나만 체크되는 원리를 이용합니다. 2. input 이 체크 되었는지 여부를 확인하여 선택할 수 있는 CSS 가상선택자 :checked 를 사용해 어떤 input이 체크 되었는지 확인합니다. 3. 만약 어떤 input에 체크되었다면 동등한 깊이(depth)의 엘리먼트. 즉, 형제격이면서 인접한 엘리먼트를 선택할 수 있는 선택자 + 를 사용하여 형제이면.. 더보기 이전 1 다음