---
# System prepended metadata

title: 7/27(二) 每日任務
tags: [大學生體驗營 - 2021 夏季班]

---

---
tags: 大學生體驗營 - 2021 夏季班
---
# 7/27(二) 每日任務

## 題目

Bootstrap 都是使用 「-」的方式做命名，將此命名方式修改成 BEM 的命名方式


```htmlembedded=
<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">Navbar</a>
  <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarNav">
    <ul class="navbar-nav">
      <li class="nav-item active">
        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Features</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Pricing</a>
      </li>
      <li class="nav-item">
        <a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>
      </li>
    </ul>
  </div>
</nav>
```



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


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

<!-- 解答：[Codepen 範例](https://codepen.io/AliceChiang/pen/gOwaPqw?editors=0100) 若答案有爭議可以提出-->


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

<!-- 1. 

-->
<!-- 2.小羊
Codepen：
https://codepen.io/eqsmebaz-the-selector/pen/LYyQENg
-->

<!-- 3.羿宣 
Codepen：https://codepen.io/Ann828/pen/oNWEgLQ?editors=0100 -->

<!-- 4. 黃珮雯
Codepen: https://codepen.io/pwh_27/pen/GRmQgqV -->

<!-- 5. 小胖
Codepen: https://codepen.io/a1073315/pen/PomQwGo -->

<!-- 6. JT
Codepen: https://codepen.io/jsht-the-animator/pen/KKmQwga -->

<!-- 7.Cloudia
Codepen: https://codepen.io/hkps87/pen/poPavPP 

<!-- 8.黃彩雲
Codepen: https://codepen.io/corin19/pen/KKmQwov -->

<!-- 9.蕭絜云
Codepen: https://codepen.io/cloudy_77/pen/ZEKrGQq -->

<!-- 10. 廖仕雅
CodePen: https://codepen.io/sophia0121/pen/JjNpdWj?editors=1100 -->

<!-- 11. Iris
Codepen: https://codepen.io/hungyen/pen/gOWvamd
-->

<!-- 12. Jack
Codepe: https://codepen.io/JackChen89/pen/abWqzXX?editors=1010 -->

<!-- 13. 劉子瑜
Codepe: https://codepen.io/superfish195/pen/NWjyGXZ -->

<!-- 14. 德德
Codepe: https://codepen.io/Chiouder/pen/gOWvaJy?editors=1010 -->

<!-- 15. 莊承叡
Codepen：https://codepen.io/Ray_ty39/pen/XWRZXEY?editors=1000
-->

<!--16.廖奕慈
Codepen: https://codepen.io/yiciLiao/pen/zYwRrPa?editors=1100 -->

<!--17. Steve
Codepen: https://codepen.io/steve5631/pen/rNmJxRZ
-->

<!--18. 小松
Codepen：https://codepen.io/120061203/pen/BaRYjKy
-->

<!--19. 劉永琦
Codepen: https://codepen.io/wjsvypvv-the-decoder/pen/mdmXRBj -->

<!--20. 黃郁芳
Codepen: https://codepen.io/YuFang0323/pen/BaRYWdo -->

<!--21. 辰
Codepen: https://codepen.io/dnangelapril/pen/QWvQqYZ
-->

<!--22. 人中
Codepen: https://codepen.io/renchong2424/pen/poPaWmY
-->

<!-- 23. 謝旻臻
Codepen: https://codepen.io/julia20010828/pen/eYWVedN?editors=1100 -->

<!-- 24. 馮旻
Codepen: https://codepen.io/tboqkvhk/pen/wvdyPZV-->

<!-- 26. 薰
Codepen: https://codepen.io/chiaoshin/pen/yLbKVLP -->

<!-- 27. 陳書妤
Codepen: https://codepen.io/shuyu227/pen/gOWKzMz?editors=1000 -->