基本骨格 チェックボックスのlabelをオープン用とクローズ用の2つ用意する。 メニュー部分は予め画面外に隠しておき、オープンボタンを押す(チェックが入る)とtransformで0地点へ移動するようにする。再びオープンボタンを押せばチェックが外れてメニューが隠れる。 また、クローズボタンは画面全体であるが、メニュー部分よりはz-indexが下で、メニューが開いた時(チェックが入った時)のみ、背景を付けて、マウス操作(チェックのオフ)を可能にする。 #navTgl:checked + .openで、チェックが入ったらクラスがopenのラベルに対してする操作を、#navTgl:checked ~ .closeで、クラスがcloseのラベルに対してする操作をそれぞれ指定できる。 これがjavascriptでいうonclickとかに相当する。 ≡ <!--html--> <input type="