HTML＋CSSで作るアコーディオンメニューの作成例：ラジオボタン版1

HTML＋CSSで作るアコーディオンメニューの作成例：ラジオボタン使用版1(アニメーション効果はなし)

メニュー項目A

～ Aに対応するコンテンツを表示～

メニュー項目B

～ Bに対応するコンテンツを表示～

メニュー項目C

～ Cに対応するコンテンツを表示～

メニュー項目D

～ Dに対応するコンテンツを表示～

メニュー項目E

～ Eに対応するコンテンツを表示～

上記の点線枠内の項目をクリックすると、クリックした項目だけが展開され、他に開いている項目は自動で閉じられます。
この動作はCSSだけで実現しており、スクリプトは使っていません。