# 🏅 Day 20 - CSS 權重覆蓋

> 口訣：先看權重再看先後
> 若還不熟悉權重可以參考這篇[文章](https://developer.mozilla.org/zh-CN/docs/Web/CSS/Specificity#%E4%BC%98%E5%85%88%E7%BA%A7%E6%98%AF%E5%A6%82%E4%BD%95%E8%AE%A1%E7%AE%97%E7%9A%84%EF%BC%9F)

### 題目

**觀看各題程式碼回答問題**

1. 請問 p 標籤內文字是什麼顏色

HTML

    <p class="blue red black">這是藍色ㄉ文字</p>

CSS

    p {
      color: white;
    }

    .black {
      color: black;
    }

    .blue {
      color: blue;
    }

    .red {
      color: red;
    }

2. 請問 p 標籤內文字是什麼顏色

HTML

    <p class="a p">這是藍色ㄉ文字</p>

CSS

    p {
      color: white;
    }

    .p {
      color: blue;
    }

    a {
      color: red;
    }

3. 請問 p 標籤內文字是什麼顏色

HTML

    <p class="p blue" id="blue">這是藍色ㄉ文字</p>

CSS

    .p {
      color: blue;
    }

    .blue {
      color: red;
    }

    p.blue {
      color: green;
    }

    #blue {
      color: white;
    }

## 回報流程

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


<!-- 解答：
1. red
2. blue
3. white
-->

回報區
---

|#|Discord|CodePen / 答案|
|:----:|:----:|:----:|
| 1 | han | [Codepen](https://codepen.io/iamHanCheng/pen/BagoNWa) |
| 2 | emmayo | [Codepen](https://codepen.io/emmayo/pen/oNrbRRP) |
| 3 | 黛西 | [Codepen](https://codepen.io/ChiashengLin/pen/BagjeEB) |
| 4 | 毛巾 | [Codepen](https://codepen.io/bqdcjboa-the-solid/pen/zYVrQQP) |
| 5 | Kiwi | [Codepen](https://codepen.io/kiwi1113/pen/NWZxVQG) |
| 6 | yoishere | [Codepen](https://codepen.io/yoishere/pen/VwJeOJV) |
|7|Hailey|[Codepen](https://codepen.io/sxbokfja-the-flexboxer/pen/wvLMLva)|
|8|tim|[Codepen](https://codepen.io/jskrtivy-the-animator/pen/abgoOme)|
| 9 | fendy1223 | [Codepen](https://codepen.io/fendy1223/pen/bGPEPBp) |
| 10 | Lobinda | [Codepen](https://codepen.io/Lobinda/pen/dyBGBNr)|
| 11 | Sammy | [Codepen](https://codepen.io/fsczdlla-the-bold/pen/poXgXrr)|
| 12 | 邵 |[Codepen](https://codepen.io/ukscrlno-the-typescripter/pen/QWXyXzq)|
| 13 | ninii傳教士 |[Codepen](https://codepen.io/niiniiii/pen/LYKGKJo)|
| 14 | NocabWang(培根) |[Codepen](https://codepen.io/PeihanWang/pen/LYKGwGE?editors=1000)|
| 15 | Dolce_墨 | [Codepen](https://codepen.io/DolceTseng1026/pen/XWLXvWO) |
| 16 | Chuang | [Codepen](https://codepen.io/uidoytjq-the-solid/pen/mdZVNKM) |
| 17 | Mike | [Codepen](https://codepen.io/mike2049/pen/PorZMRE?editors=1100) |
| 18 | Ariel | [Codepen](https://codepen.io/ariel0510/pen/zYVrgQv?editors=1010) |
| 19 | Amy(咂摳) | [Codepen](https://codepen.io/nnxucgmc-the-builder/pen/zYVqOEN) |
| 20 | david1819 | [Codepen](https://codepen.io/David-Lin-the-vuer/pen/NWZNKaZ) |
| 21 | Yolanda | [Codepen](https://codepen.io/vcscqrtz-the-animator/pen/OJeNJmy) |
| 22 | 陳小廷 | [Codepen](https://codepen.io/ting1124/pen/bGPpGKg) |
| 23 | fan_fan | [Codepen]() |
| 24 | kawa | [Codepen](https://codepen.io/z83xji6/pen/xxoVbRK) |
| 25 | Kaya | [Codepen](https://codepen.io/kayaribi/pen/RwzaNOj) |
| 26 | lunlun0514 | [Codepen](https://codepen.io/f5badapple/pen/mdZPJyx) |
| 27 | 皮皮 | [Codepen](https://codepen.io/rainbow-the-reactor/pen/rNEeVWe)|
| 28 | Jim | [Codepen](https://codepen.io/JimChou/pen/MWMyayo?editors=1100)|
| 29 | jimmy.0706 | [Codepen](https://codepen.io/JimmyMao/pen/rNEeOzd)|
| 30 | Sonia | [Codepen](https://codepen.io/YUJOU/pen/vYqGNeo)|
| 31 | Jainee | [Codepen](https://codepen.io/Jainee0110/pen/XWLdXGJ)|
| 32 | MY | [Codepen](https://codepen.io/ahmomoz/pen/VwJaaYz)|
| 33 | zaoannihao | [Codepen](https://codepen.io/ckhwdvrx-the-solid/pen/bGPppxX) |
| 34 | wind | [Codepen](https://codepen.io/wind7y/pen/gONrMaV) |
| 35 | shine_lalala | [Codepen](https://codepen.io/cdjpjets-the-solid/pen/GRbZqJb) |
| 35 | hao jing | [Codepen](https://codepen.io/hjxu/pen/LYKNZqK?editors=1100) |
|36|glen_69515|[Codepen](https://codepen.io/glenyaochih/pen/yLdOaMR)|
| 37 | 泊岸 | [Codepen](https://codepen.io/qoq77416416/pen/dyBMprv) |
| 38 | 超立方體Andy |[Codepen](https://codepen.io/Andy-Yu-the-scripter/pen/RwzaKaO)|
| 39 | Noelle | [Codepen](https://codepen.io/NoelleKH/pen/KKjzvBr) |
| 40 | chris | [Codepen](https://codepen.io/chrischen666/pen/NWZNBdx) |
| 41 | Arvin | [Codepen](https://codepen.io/arvinyang1925/pen/LYKNaeX) |
| 42 | Kai | [Codepen](https://codepen.io/beginneraboutlife116/pen/bGPebZP) |
| 43 | hsiu8767 | [Codepen](https://codepen.io/hsiu8767/pen/zYVBOQw) |
| 44 | GAVI | [Codepen](https://codepen.io/xmbbyswh-the-reactor/pen/VwJjYNm) |
| 45 | Kim | [Codepen](https://codepen.io/kim0101__/pen/mdZEJqL) |
| 46 | KevinHuang | [Codepen](https://codepen.io/qw-huang/pen/jOjrbmr?editors=1000) |
| 47 | PoWei | [Codepen](https://codepen.io/Po-Wei-Lai/pen/GRbqNOd) |
| 48 | EdHuang | [Codepen](https://codepen.io/yide1986/pen/gONMgaE) |
| 49 | brucelee0629 | [Codepen](https://codepen.io/xxhdklwi-the-decoder/pen/gONMmBW) |
| 50 | n913239 | [Codepen](https://codepen.io/n913239/pen/oNrLGjz) |
| 51 | 俊 | [Codepen](https://codepen.io/jun12079/pen/eYwzGZq) |
| 52 | jerry_66983 | [Codepen](https://codepen.io/Barry-C/pen/dyBXZZg) |
| 53 | OSN |[Codepen](https://codepen.io/osncodepen/pen/dyBXJxX)|
| 54| jasonlin | [Codepen](https://codepen.io/gfswkraq-the-reactor/pen/xxoOYNr)
| 55 | 嚼勁先生 | [Codepen](https://codepen.io/James520284/pen/abgZjea) |
| 56 | 咖 | [Codepen](https://codepen.io/daru-Ga/pen/GRbjKXd) |
| 57 | ho_yc | [Codepen](https://codepen.io/Ho_HYC/pen/QWXKWMb) |
| 58 | Anna |[Codepen](https://codepen.io/Anna-Teng/pen/LYKRYrB)|
| 60 | 地瓜 | [Codepen](https://codepen.io/huangtzuchin/pen/qBzaErw) |
| 61 | gracechiang225 | [Codepen](https://codepen.io/gracechiang225/pen/jOjMrEN) |
| 62 | xcx100 | [Codepen](https://codepen.io/c13026/pen/poXEwXe) |
| 63 | yaoling.liang | [Codepen](https://codepen.io/Yao-Ling-L-/pen/MWMyBdV) |
| 64 | Joanne hu | [Codepen](https://codepen.io/nelbabkv-the-flexboxer/pen/YzoGOLz) |
| 65 | ya_meow |[Codepen](https://codepen.io/gkfxzvcb-the-bashful/pen/MWMjMwY)|
| 66 | AURA TAO | [Codepen](https://codepen.io/AURATAO/pen/YzopQoJ) |
| 67 | Kerwin | [Codepen](https://codepen.io/kerwin/pen/WNqoZGd) |
| 68 | 610 | [Codepen](https://codepen.io/YI-LING-LIU/pen/NWZbovX) |
| 69 | iamcan | [Codepen](https://codepen.io/uhnxswdq-the-typescripter/pen/vYqgBgL) |
| 70 | Steven1220 | [Codepen](https://codepen.io/Steven1220/pen/poXegPg) |
| 71 | Antonio | [Codepen](https://codepen.io/gwhvusel-the-builder/pen/BagRYGL) |
| 72 | Toung | [Codepen](https://codepen.io/Toung/pen/yLdbEjz)
| 73 | Enn | [Codepen](https://codepen.io/enntang/pen/LYKLYNw)
| 74 | Emma | [Codepen](https://codepen.io/Emma0919/pen/zYVdryq) |
| 75 | qet1717 | [Codepen](https://codepen.io/gwteqexi-the-bold/pen/bGPrJjj) |
| 76 | Judy | [Codepen](https://codepen.io/yangchi/pen/YzoYXgY) |
| 77 | 小翎 | [Codepen](https://codepen.io/debbielin/pen/vYqpNXz?editors=1100) |
| 78 | 野鴿 | [Codepen](https://codepen.io/pen/) |
| 79 | ji3di | [Codepen](https://codepen.io/jwuuhtxh-the-builder/pen/abgYeWV) |
| 80 | zen | [Codepen](https://codepen.io/zen742937/pen/PoregZy) |
| 81 | 深海 | [Codepen](https://codepen.io/KAI-SHIN-the-animator/pen/BagGPma) |
| 82 | Yunya | [Codepen](https://codepen.io/cookie1515/pen/eYwbvGj) |
| 83 | Lotte | [Codepen](https://codepen.io/hmkdoxuj-the-decoder/pen/RwzmjgK) |
| 84 | KOMATSU PEI | [Codepen](https://codepen.io/Komatsu2021/pen/MWMdGOa?editors=1000) |
| 85 | Angela_la | [Codepen](https://codepen.io/Angela-the-builder/pen/XWLLPjJ) |
| 86 | eddiesun0526 | [Codepen](https://codepen.io/Eddie0526/pen/MWNVPjN) |
<!--

| No | Discord | [Codepen]() |
-->