アコーディオン - Qiita

概要 タイトルをクリックしたらコンテンツが開閉される。 Boxは配下は一つのページで複数表示されることを想定し、idでなくclassで制御している。 HTML <dl class="accordionBox"> <dt class="accordionBoxTitle js-accordionBoxTitle"> タイトル（クリック領域） <i class="accordionBoxIcon"></i> </dt> <dd class="accordionBoxDetail js-accordionBoxInner"> コンテンツ（開閉領域） </dd> </dl> .accordionBoxTitle { position: relative; padding: 4.8% 5%; font-size: 14px; text-align: center; cursor: pointer;