---
# System prepended metadata

title: 8/2(一) 每日任務
tags: [網頁切版直播班 - 2021 夏季班]

---

---
tags: 網頁切版直播班 - 2021 夏季班
---
# 8/2(一) 每日任務

## 題目

請練習使用 [Bootstrap](https://bootstrap5.hexschool.com/docs/5.0/components/accordion/) 任何一個元件

需透過 Codepen 繳交 （載入 Bootstrap CSS：https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css ）

![](https://i.imgur.com/9UbRit4.png)


## 回報流程
1. 將答案寫在 Codepen 並複製 Codepen 連結貼至「回報區」中回報就算完成了喔～
    解答及回報方式請參考下方


![](https://i.imgur.com/vftL5i0.png)

<!-- 解答：[以按鈕元件為例](https://codepen.io/Bingbingboom/pen/wvJrMrM) -->


回報區
---
<!-- 0. Bingbingboom（回報範例，請使用註解回報）
Codepen：https://codepen.io/Bingbingboom/pen/wvJrMrM
-->

<!-- 1. 焦糖
Codepwn：https://codepen.io/yen-kg/pen/oNZVKZL
-->

<!-- 2. Jasmin
Codepwn：https://codepen.io/thejasmin/pen/GRrQVoJ
-->

<!-- 3. Alpha
Codepen:https://codepen.io/alphatero/pen/rNmKdPX
-->

<!--  4.kevinhes
codepen:https://codepen.io/dwpwdpad/pen/RwVJMmZ
-->

<!-- 5. Lina Chen
codepen: https://codepen.io/LinaChen/pen/JjNZLgX
-->

<!-- 6. 陳sam
codepen: https://codepen.io/euldpliv/pen/ExmRLjP
-->

<!-- 7. Jean
codepen: https://codepen.io/jean-liu/pen/eYWKrNY
-->
<!-- 8. LiShang
codepen: https://codepen.io/li-shang/pen/ZEKRobz
-->

<!-- 9.Sam li
codepen:https://codepen.io/sam830623/pen/LYyrmVx
-->


<!-- 10.lumei
codepen:https://codepen.io/l_umei/pen/KKmeRML
-->

<!-- 11.Xing
codepen:https://codepen.io/xing10/pen/MWmXGbg
-->

<!-- 12. hellocrab
https://codepen.io/hellocrab/pen/VwpzWEG
-->

<!-- 13. 雷古娜
https://codepen.io/tinahopo/pen/rNmKvmx 
-->

<!-- 14. roger
https://codepen.io/rogerchuang/pen/KKmeRvO?editors=1000 
-->

<!-- 15. 大衛 
https://codepen.io/exnsrpjc/pen/poPKVpo 
-->

<!-- 16. curry
https://codepen.io/Ted19851223/pen/OJmEZQr 
-->

<!-- 17.zyc https://codepen.io/zy_c/pen/YzVvLea -->

<!-- 18.Tori
codepen(頁面滾動監控): https://codepen.io/hayen/pen/abWKGZZ
-->

<!-- 19. Elaine Liu
麵包屑 https://codepen.io/elaine7598/pen/rNmKvvL
-->

<!-- 20. Fleur
卡片 https://codepen.io/swwlee/pen/OJmjqLL
-->

<!-- 21. Gui
卡片 https://codepen.io/guitimliu/pen/RwVJyve -->

<!-- 22. yijun
按鈕
https://codepen.io/sandy3068/pen/BaRVxgg
-->

<!--23. 阿和
按鈕
codepen:https://codepen.io/shnny/pen/XWRYYrg
-->

<!--24. RitaHuang
https://codepen.io/Rita-Rossweisse/pen/vYmrjPz
-->

<!-- 25. Sz
https://codepen.io/szyln/pen/abWGEqL
-->

<!-- 26. Ariel 互動視窗 (Modal)
https://codepen.io/Arielariel/pen/xxdzzay
-->

<!-- 27. huanan
https://codepen.io/hua_nan/pen/abWKped
-->

<!-- 28.肉鬆
codepen(導覽列): https://codepen.io/klrkicog/pen/dyWKjeM
>

<!--29.童筱涵 (Modal)
codepen:https://codepen.io/hsiaohan/pen/dyWKjjX
-->

<!--30. Dory
codepen: https://codepen.io/dorihung/pen/XWRYPVK
-->

<!--31. Cate Chang
codepen: https://codepen.io/tutz/pen/jOmKvXE
-->

<!--31. YuriT
codepen: https://codepen.io/wenfisht/pen/gOWKdyq
-->

<!--32. Gill
codepen:https://codepen.io/Gill-Chin/pen/LYyrJyy
-->

<!--33. 群嘉
cosepen:https://codepen.io/efzdamnp-the-lessful/pen/oNWyavd
-->

<!--34. SihLe Huang
code: https://codepen.io/bugbug777/pen/ZEKRqLy
-->

<!-- 35.阿瓜 輪播
https://codepen.io/hoick/pen/wvdjzXw -->

<!-- 36. Tsai 明達
CodePen: https://codepen.io/bmzpfyxe/pen/MWmGpgY?editors=1000
-->

<!--37.Peggy Tsai
https://codepen.io/pei-chi-tsai/pen/GRmGYXg -->

<!--38.格可
https://codepen.io/catabo/pen/JjNZeRQ-->

<!--39.Jerry Yen
https://codepen.io/JerryYen/pen/PomaLNb -->

<!-- 40. Ruby Chiang
Codepen:https://codepen.io/rubyyl0701/pen/PomaVBq  (Cards) 
-->

<!-- 41. Tina Yen
codepen: https://codepen.io/tlorfrnl-the-typescripter/pen/mdmKoam
-->

<!-- 42. Cheng Pei-hsuan
codepen: https://codepen.io/PaCheng/pen/poPLjoG
-->

<!-- 43.黃士桓
codepen: https://codepen.io/shr-huan-huang/pen/ZEKRZLE
-->

<!-- 44. Jamie
codepen: https://codepen.io/JamieChenWs/pen/NWjzmMm
-->

<!-- 45. axlrock1021
codepen: https://codepen.io/andy1021/pen/VwbdOwB
-->

<!-- Hi Annie
https://codepen.io/lhohdalu/pen/xxdjNNe
-->

<!-- 47. Benson
https://codepen.io/polarBear712/pen/PomavjY
-->

<!-- 48. jimmyFang
https://codepen.io/pohxiqqo/pen/LYyrova?editors=1010
-->

<!-- 49. KinHei Shing
https://codepen.io/kinhei-shing/pen/gOWjOPM
-->

<!-- 50. 沈依蓉 
https://codepen.io/lily-oa/pen/ExmpVpB
-->

<!-- 51. Riley 
https://codepen.io/jjpxbprd/pen/gOWjwej
-->

<!-- 52. KK
https://codepen.io/potatokaka/pen/ExmpNRE
-->

<!-- 53. PHIL
https://codepen.io/ctkeftjp-the-animator/pen/jOmpyVa
-->

<!-- 54. Joy Cheng
codepen https://codepen.io/joycheng5432/pen/qBmKbgx
-->

<!-- 55. anna
codepen https://codepen.io/annhys/pen/bGWjrdK?editors=1100
-->
<!-- 56. Winnie
codepen https://codepen.io/winnie0208/pen/xxdJXWj
-->

<!-- 57. Jim Hwang
codepen https://codepen.io/jimh1129/pen/YzVjaVP
-->

<!-- 58. Jessie Cheng
codepen https://codepen.io/JessieMosbi/pen/OJmwwYx
-->

<!--  59. ellie
https://codepen.io/hsu-yu/pen/RwVBvgE
-->
<!-- 60. icy 
https://codepen.io/ccsbjzze-the-sasster/pen/XWRPJeW -->

<!-- 61. KatieZhao
https://codepen.io/katiezhao/pen/NWjLGdd -->

<!-- 62. Una
https://codepen.io/xbsapbas-the-vuer/pen/XWRPdvZ -->

<!-- 63. yella moon
https://codepen.io/pwbzvqja/pen/ExmRJQN -->

<!-- 64. Alberto
https://codepen.io/AlbertoLL/pen/eYWLvxm
-->

<!-- 65. ZOE WU
codepen.io/Zoechiueh/pen/xxdamwv?editors=1100
-->

<!-- 66. Min Chun Tsai
https://codepen.io/Tsai0926/pen/eYWPwqr
-->

<!-- 67. Erin Huang
https://codepen.io/ErinHuang/pen/PomxWoL
-->

<!--68. Jocelyn Wu
https://codepen.io/enjoyful/pen/ZEKmLMX
-->
<!-- 69.Shani
https://codepen.io/ShaniMa/pen/gOWKwKZ
-->

<!--70. WilsonHan
https://codepen.io/wi0821/pen/OJmazVN
-->

<!-- 71: Sec
https://codepen.io/Sentiments/pen/mdmQXrB
-->

<!-- 72.Page
https://codepen.io/kanawin821/pen/RwVqrXV
-->

<!-- 73.Oober
https://codepen.io/xtsjrjdv/pen/RwVEeJZ
-->

<!-- 74. 魚魚
https://codepen.io/YuYu_29/pen/mdmvELz
-->

<!-- 75. Jun Chan
codepen(畫布)：https://codepen.io/chujunchan/pen/ExmrOJX
-->

<!-- 76. YOYO
https://codepen.io/lumedkle/pen/dyWLQZp
-->

<!-- 77. Joe Kuo
https://codepen.io/alertislow/pen/GRmaXZx
-->

<!-- 78. WA
輪播
https://codepen.io/ldddl/pen/JjNQoNb
-->

<!-- 79. YJ kung(button)
https://codepen.io/bagelover/pen/MWmNBGV?editors=1100
-->

<!-- 80. AKI
https://codepen.io/akichen27/pen/PojzPrE
-->