---
tags: 網頁切版直播班 - 2022 夏季班
---
# 🏅 Day 49

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

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">Navbar</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-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>

## 回報流程

將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔!
解答位置請參考下圖（需打開程式碼的部分觀看）


<!-- 解答：https://codepen.io/hexschool/pen/eYMXgBr?editors=1000 -->

回報區
---

| Discord | CodePen / 答案 |
|:-------------:|:--------------------------------------------------:|
| LinaChen#1796 | [Codepen](https://codepen.io/LinaChen/pen/WNJedEr) |
| 布魯諾#7239 | [Codepen](https://codepen.io/bruno-yu/pen/qBYWpjK) |
| 大衛#4869 | [Codepen](https://codepen.io/exnsrpjc/pen/RwybxBz) |
| Chi#7605 | [Codepen](https://codepen.io/YoChi84/pen/wvjwpOW) |
| JackC#0411 | [Codepen](https://codepen.io/key0329/pen/gOzYoEp) |
| Potatolee#7749 | [Codepen](https://codepen.io/potatoleee/pen/oNdvpKR?editors=1000) |
| 威爾#1694 | [CodePen](https://codepen.io/WILL_Wu/pen/KKRPQpy) |
| YI#0863 | [CodePen](https://codepen.io/YI0305/pen/OJZLQNb) |
| Clara#1275 | [CodePen](https://codepen.io/bsupixqu/pen/PoeYQmW) |
| yuyu#6310 | [CodePen](https://codepen.io/yuyu0905/pen/JjvPpyg) |
| LHchien33#6232 | [CodePen](https://codepen.io/lin_chien/pen/zYjORpX?editors=1000) |
| Joyce#3790 |[CodePen](https://codepen.io/joycehuang/pen/JjvPpaj?editors=1010)|
| CloThEs#7837 |[CodePen](https://codepen.io/CloThEsZ/pen/RwybMVx)|
|int#7518|[Codepen](https://codepen.io/intHuang/pen/MWGgVQY?editors=1010)|
|QOO#8446|[Codepen](https://codepen.io/QOOQOOQ/pen/eYrOKBL?editors=1100)|
|Tuhacrt#0008|[Codepen](https://codepen.io/Tuhacrt/pen/bGMbjzJ)|
|WEI_RIO#9342|[Codepen](https://codepen.io/wei_wu/pen/BaxBOjg?editors=1000)|
|我是泇吟#5189|[CodePen](https://codepen.io/kljuqbxs/pen/WNJeaOZ)|
|雷雷#7844|[CodePen](https://codepen.io/lei-yi-jie/pen/KKRProj?editors=1100)|
|Cliff#4606|[Codepen](https://codepen.io/Cliff_hex/pen/MWGgzdK?editors=1000)|
|ssozr#4680|[codepen](https://codepen.io/ssozr/pen/oNdvJJm)|
|Benson#6763|[codepen](https://codepen.io/kumashow/pen/XWqrONx)|
| azami#5986 |[CodePen](https://codepen.io/azami/pen/eYrYJwy)|
| Jenny真#7532 | [CodePen](https://codepen.io/wei-chen-wu/pen/abGoQap) |
| Henry#7386 |[CodePen](https://codepen.io/h1nr9/pen/jOxOMvM)|
|IreneY#0086|[Codepen](https://codepen.io/HalfPlannedJourney/pen/oNdNoYL)|
|SASIMI#5099|[Codepen](https://codepen.io/sashimi1327/pen/KKRwWQp)|
|黑白兔#0684|[Codepen](https://codepen.io/johnny329/pen/gOzbvYN)|
|mei#8421|[Codepen](https://codepen.io/Shila-Chen/pen/gOzpRww?editors=1000)
| Amberhh #2465 | [Codepen](https://codepen.io/Amberhh/pen/dyebdeY) |
|Ryan Chiang#6649|[Codepen](https://codepen.io/ryanchiang/pen/ExLVXRM?editors=1000)|
|sophiee#7015|[Codepen](https://codepen.io/sophiee2727/pen/mdLPwRg?editors=1100)|
|kancheng#3915|[Codepen](https://codepen.io/kancheng/pen/BaxWLKv?editors=1000)|
|Vera#5592|[Codepen](https://codepen.io/skvera/pen/abGyXRy)|
|Mylène#2481|[Codepen](https://codepen.io/hamajibashi/pen/xxjPbxQ)|