アコーデオンメニューのラベルを画像にしたい

Question

お世話になります。
どうしても解らないので教えていただきたいです。
bootstrapでサイトを作っています。
あるページにアコーデオンを実装したいのですが、このアコーデオンのラベルを画像に
したいのです。
cssで作るアコーデオンを貼り付けてラベルの中にimgタグで画像を入れてみたのですが、
画像はきれいに出ますがup,downの矢印iconが消えてしまいます。この矢印を表示させるにはどうしたらいいのでしょうか。どうしてもうまくいかなくて困っております。お知恵をお貸しください。よろしくお願い致します・```ここに言語を入力

     <div class="cp_actab">

<input id="tab-1" type="radio" name="tabs2"> <label for="tab-1" class="tab1"><img src="images/course_02.jpg" alt="体験ダイビング" class="img-fluid"></label> <div class="cp_actab-content"> <p </p> </div> </div> <div class="cp_actab"> <input id="tab-2" type="radio" name="tabs2"> <label for="tab-2" class="tab2"><img src="images/course_03.jpg" alt="初級コース" class="img-fluid"></label> <div class="cp_actab-content"> <p > </p> <p class="up-bottom"><a href="#course-2"><img src="images/up-bottom.jpg" alt="上に上がるボタン"></a></p> </div> </div> <div class="cp_actab"> <input id="tab-3" type="radio" name="tabs2"> <label for="tab-3" class="tab3"><img src="images/course_04.jpg" alt="中級コース" class="img-fluid"></label> <div class="cp_actab-content"> <p> </p> <p class="up-bottom"><a href="#course-3"><img src="images/up-bottom.jpg" alt="上に上がるボタン"></a></p> </div> </div> ```

Comments

[y_waiwai]

コードは、<code>ボタンで、’’’の枠の中に貼り付けてください

[m.ts10806]

「CSS」「Bootstrap」もタグに追加しておいてください。これに限らずフレームワークやプラグイン、ライブラリなどを利用されている場合は、独自の仕組みを利用いていたりして、元々の言語知識だけでは対応できないことも多いです。具体的なタグをつけることでより専門的な技術や知識をもった回答者の目にとまりやすくなりますので、工夫してみてください。　https://teratail.com/tags

Answer 1

まず，インデントを整えてください（インデントは半角スペースx2/x4ずつです．全角スペースは含まないでください．予期しない動作の原因になります．）

黄色い印がついている行がおかしいので，まずそこを直してください

黄色①：開始タグがおかしい
黄色②：おまえは誰だ
黄色③：終了タグがない

もっと細かい話をすると，アコーディオンメニューの中にpタグ（「文章」を表すタグ）が入ってるのもおかしいですし，それが空っぽなのもおかしいです．spanタグ使うか，削除しましょう．

そして，ご提示のコードから現在再現できるのはこの程度です．何も分かりません
（画像のコードは若干修正しています）

せめてBootsrtapのバージョンとか，ライブラリの参照に使ったlinkタグとかを載せてもらわないと，ちょっと検証しきれないです...><