details要素を使ってHTML/CSSのみでドロップダウンメニューを実装する
DRANK
HTML5からdetails要素が追加された。この要素は折りたたみ可能なウィジェットを作成するもので、open状態になったときだけ子要素(summary要素など)を表示することができる。 このdetails要素を使えばHTMLだけでアコーディオンメニューが簡単につくれるようになる。 今回はこのdetails要素に手を加え、JavaScriptを使わず、HTML/CSSのみでドロップダウンメニューを実装する方法を紹介する。