アコーディオンをhtmlとcssだけで作る方法
HTML/CSS
htmlのチェックボックスを使ってhtmlとcssだけでアコーディオンを作る方法
クリックで開閉するアコーディオンをhtmlとcssだけで実装する時の記述方法を紹介します。
下の記述例では「質問と回答」を想定したアコーディオンを作ってみました。
チェックボックスのチェックの有無でアコーディオンの中身の表示/非表示を切り替え、合わせてcssの擬似要素を使って矢印の表示も切り替えています。
See the Pen
ZEGLLrq by saku (@web-saku)
on CodePen.
コメントを残す