토글메뉴 썸네일형 리스트형 순수 CSS만으로 오프캔버스 메뉴 만들기 자바스크립트나 Jquery 도움 없이 순수하게 html과 css만을 이용해 오프캔버스 메뉴를 만드는 방법을 소개합니다.이 방법은 지금 현재 코드랩 블로그에서 타블릿 PC와 모바일 해상도에 적용해 사용하고 있는 방법입니다. 아래 결과물과 소스를 한번 먼저 보여드리고 간략히 원리를 설명하겠습니다. See the Pen #offcanvas - pure css by moksunung (@moksunung) on CodePen. 위와 같이 오프캔버스를 구현하는 원리는 다음과 같습니다. 1. 체크박스를 만든 뒤 display:none; 하여 감춥니다. 2. 위 체크박스에 연결되는 label을 만들어 버튼으로 사용합니다. (토글버튼 = 라벨 1번) 3. 마찬가지로 체크박스에 연결되는 또 하나의 label을 posit.. 더보기 이전 1 다음