---
# System prepended metadata

title: "\U0001F3C5 Day 22"
tags: [網頁切版直播班 - 2022 夏季班]

---

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

## RWD 觀念選擇題
### 題目
**選擇題，一共五題，可群組討論，請在任務提交時要解釋選擇答案的原因。**

1. 請問下列何者是正確的 media query 語法？

   A. @media (min-width: 600px) {...}
   B. @media min-width: 600px {...} 
   C. @media (min-width = 600px) {...}
   D. @media min-width = 600px {...}
   
   

2. 根據以下 CSS 請問最後字呈現的顏色為什麼？

    ```jsx
    <div id="color-id" class="color-class">Color</div>

    <style>
    	.color-class { color: blue; }
    	#color-id { color: red; }
    	div {color: yellow; }
    </style>
    ```

    A. 藍色
    B. 紅色 
    C. 黃色
    D. 黑色
    
    
    
    
3. 根據以下 CSS，在螢幕解析度 600px 時文字的顏色為何？

    ```jsx
    @media (min-width: 576px){
        p { color: red;}
    }
    @media (min-width: 768px){
        p { color: black; }
    }
    p { color: yellow; }
    ```

    A. 紅色 
    B. 黑色
    C. 黃色
    D. 藍色
    
    
    
    
4. 根據以下 CSS，在螢幕解析度 600px 時文字的顏色為何？

    ```jsx
    p { color: yellow; }
    @media (min-width: 576px){
        p { color: red;}
    }
    @media (min-width: 768px){
        p { color: black;}
    }
    ```
    
    A. 紅色 
    B. 黑色
    C. 黃色
    D. 藍色
    
    
    
5. 針對響應式圖片的設定，應該幫 img 標籤加上什麼語法？

    A. max-width:100% 
    B. width:100% 
    C. max-width: 100px
    D. width: 100px
    
    

## 回報流程

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

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

<!-- 解答：ABCAA -->


回報區
---


|      Discord      |                           CodePen / 答案                            |
|:-----------------:|:-------------------------------------------------------------------:|
|   薏慈#3795   |          [CodePen](https://codepen.io/its_wang/pen/KKoEJRV)          |
|   Anna Liu#3794   |          [CodePen](https://codepen.io/anna618/pen/WNzZvmK)          |
|     𝓛𝓊𝒸𝓎#8635     |         [CodePen](https://codepen.io/lucygirl/pen/KKogxBw)          |
|   CloThEs#7837    |         [CodePen](https://codepen.io/CloThEsZ/pen/yLKoOLE)          |
|     小白#2406     |        [CodePen](https://codepen.io/gracewhite/pen/zYWdmWg)         |
|    布魯諾#7239    |         [CodePen](https://codepen.io/bruno-yu/pen/QWmMZXJ)          |
|     hua#9099      |           [Codepen](https://codepen.io/LHua/pen/wvmqQvx)            |
|  Iris Huang#6727  |          [CodePen](https://codepen.io/ythuang/pen/vYRJQEe)          |
|  Clara Cai#7097   |        [CodePen](https://codepen.io/Clara-Snowy/pen/eYMEPqO)        |
|   LinaChen#1796   |         [CodePen](https://codepen.io/LinaChen/pen/rNdzQeV)          |
|    Clara#1275     |         [CodePen](https://codepen.io/bsupixqu/pen/vYRJQGW)          |
|      YI#0863      |          [CodePen](https://codepen.io/YI0305/pen/ZExJmpY)           |
|  christina#6185   |        [Codepen](https://codepen.io/chrisc0210/pen/JjLyeYR)         |
|   WEI_RIO#9342    |    [codePen](https://codepen.io/wei_wu/pen/WNzEYRm?editors=1100)    |
| bonnieli1414#4906 | [codePen](https://codepen.io/bonnieli1414/pen/bGvrQBO?editors=1100) |
|   Jenny真#7532    |        [CodePen](https://codepen.io/wei-chen-wu/pen/PoRKxxV)        |
|    黑白兔#0684    |         [CodePen](https://codepen.io/johnny329/pen/jOzLQRP)         |
|     威爾#1694     |          [CodePen](https://codepen.io/WILL_Wu/pen/LYdjXvd)          |
|   Daisy_Li#4231   |    [Codepen](https://codepen.io/lidairong-gmail-com/pen/PoRKXwr)    |
|  Potatolee#7749   |        [Codepen](https://codepen.io/potatoleee/pen/abYyPdq)         |
|      peter#0      |         [Codepen](https://codepen.io/JIAN-RONG/pen/KKovbpM)         |
|    JackC#0411     |          [Codepen](https://codepen.io/key0329/pen/poLrqEN)          |
|     洋蔥#5295     |    [Codepen](https://codepen.io/HSUNA/pen/NWYvEwm?editors=1100)     |
|     小諾#1866     |          [Codepen](https://codepen.io/noichan/pen/poLrqeR)          |
|     Vera#5592     |          [Codepen](https://codepen.io/skvera/pen/rNdzoyY)           |
|     int#7518      |         [Codepen](https://codepen.io/intHuang/pen/LYdjMXa)          |
|    leeli#6423     |         [Codepen](https://codepen.io/leelilee/pen/qBoXgBG)          |
|  PeggyLiao#1552   |  [CodePen](https://codepen.io/PeiJu-Liao/pen/LYdjqbY?editors=1010)  |
|     QOO#8446      |   [CodePen](https://codepen.io/QOOQOOQ/pen/MWVvZqO?editors=1100)    |
|  LHchien33#6232   |         [CodePen](https://codepen.io/lin_chien/pen/JjLywNB)         |
|     zera#6060     |        [CodePen](https://codepen.io/zera-tseng/pen/MWVvLzx)         |
|     鴨鴨#9822     |   [Codepen](https://codepen.io/qrvrqvxv-the-selector/pen/Bardbpq)   |
|    Joyce#3790     |        [Codepen](https://codepen.io/joycehuang/pen/vYRJPdj)         |
|     咻蹦#1526     |   [Codepen](https://codepen.io/emmasyu/pen/wvmqQRL?editors=1100)    |
|     yuyu#6310     |         [Codepen](https://codepen.io/yuyu0905/pen/VwXzNWg)          |
|     威0#6919      | [Codepen](https://codepen.io/n0918679182/pen/NWYvmbG?editors=1000)  |
|     WEI#0797      |    [Codepen](https://codepen.io/wei-z/pen/poLrBOr?editors=1010)     |
|    Henry#7386     |           [Codepen](https://codepen.io/h1nr9/pen/WNzEBbE)           |
|     雷雷#7844     |        [Codepen](https://codepen.io/lei-yi-jie/pen/qBoXwgv)         |
| Ryan Chiang#6649  |        [Codepen](https://codepen.io/ryanchiang/pen/ZExJNGj)         |
|  Yuna Huang#2692  |   [Codepen](https://codepen.io/Yuna1002/pen/QWmMRjO?editors=1010)   |
|  suihsilan#9485   |         [Codepen](https://codepen.io/suihsilan/pen/WNzEWwQ)         |
|    Barret#1119    |        [CodePen](https://codepen.io/barret0720/pen/GRxvaEr)         |
|    黃士桓#7654    |      [codePen](https://codepen.io/shr-huan-huang/pen/oNqerdo)       |
|      Ke#1391      |         [Codepen](https://codepen.io/federerke/pen/ZExJgKy)         |
|    ssozr#4680     |           [codepen](https://codepen.io/ssozr/pen/ExEvqqO)           |
|    阿翰 #1984     |         [codepen](https://codepen.io/JohnHan05/pen/eYMGOJL)         |
|    鉦勝 #8333     |        [codepen](https://codepen.io/atckmax823/pen/WNzZeZM)         |
|    Yunei#6323     |           [codepen](https://codepen.io/Yunei/pen/abYLoXz)           |
|    JarDar#6980    |         [codepen](https://codepen.io/jardarpen/pen/XWEeWRX)         |
|     Chi#7605      |          [Codepen](https://codepen.io/YoChi84/pen/oNqGgEJ)          |
|     yu魚#1330     |           [CodePen](https://codepen.io/Yu_yu/pen/LYdzEQX)           |
|     大衛#4869     |   [CodePen](https://codepen.io/exnsrpjc/pen/LYdzEgq?editors=1010)   |
|     曼曼#8356     |        [CodePen](https://codepen.io/Vanyacheer/pen/XWEebjo)         |
|   Yuan962#5897    |       [Codepen](https://codepen.io/Jasmine-Liao/pen/mdxBewx)        |
|     狸貓#5863     |         [Codepen](https://codepen.io/tanuki320/pen/JjLrYaJ)         |
|  我是泇吟 #5189   |         [Codepen](https://codepen.io/kljuqbxs/pen/KKoXaGK)          |
|   NeilLin#3009    |         [Codepen]( https://codepen.io/a0071421/pen/LYdzxoe)         |
|   Jamie Wu#9345   |         [CodePen](https://codepen.io/Wu220103/pen/rNdGyrp)          |
|Fang #4680|[Codepen](https://codepen.io/std95174/pen/mdxBmOP)|
|Amberhh#2465|[Codepen](https://codepen.io/Amberhh/pen/YzarQrE?editors=1100)|
| 連小艾#0791 |[Codepen](https://codepen.io/bolaslien/pen/mdxBwqx?editors=1000)|
| Fanglin#4054 | [CodePen](https://codepen.io/flynn841028/pen/ZExXJYp) |
| ajhappy#6488 | [CodePen](https://codepen.io/ajhappy5438/pen/WNzZXbg) |
| Melon#0380 | [CodePen](https://codepen.io/BalaFang/pen/bGvoYex) |
|SASIMI#5099|[Codepen](https://codepen.io/sashimi1327/pen/xxWLqpy)|
| 柏PO #5617| [CodePen](https://codepen.io/apo_1798/pen/ExEwbqm)|
|hungya#0773|[Codepen](https://codepen.io/hungya777/pen/yLKzpGo)|
|鑫鑫#4346|[CodePen](https://codepen.io/Neil1024/pen/QWmqmGz)|
|   楓之聲#6945   |          [codepen](https://codepen.io/sshane258/pen/jOzGzBJ)          |
|Mylène#2481|[Codepen](https://codepen.io/hamajibashi/pen/ExEwdMq)|
| Shuo#1596 |[Codepen](https://codepen.io/std95174/pen/mdxBmOP)|
|Sentiments#4883|[codepen](https://codepen.io/Sentiments/pen/oNqobEM)|
|kancheng#3915|[codepen](https://codepen.io/kancheng/pen/dymZRmv)|
|Deborah#0033|[codepen](https://codepen.io/deborah-tsai/pen/GRxOdWw)|
|Tori#1248|[codepen](https://codepen.io/FlyTori/pen/yLKPRYX)|
|IreneY #0086|[Codepen](https://codepen.io/HalfPlannedJourney/pen/BarmqyN)
|Tuhacrt#0008|[codepen](https://codepen.io/Tuhacrt/pen/NWYwOdb)|
|Carrie #2750|[codepen](https://codepen.io/carrie-wang/pen/BarmXzv)|
|mei#8421|[codepen](https://codepen.io/Shila-Chen/pen/bGvaGXQ)|
|piha#9987|[Codepen](https://codepen.io/pihahaha/pen/NWYXPzK)|
|GARBO#6659|[Codepen](https://codepen.io/garbo8130/pen/gOeoRyv)|
|Cream#3449|[Codepen](https://codepen.io/frxdwbbi-the-sasster/pen/XWEVmVv)|
|aki|[codepen](https://codepen.io/aki168/pen/NWYXzXR)|
|choubree#4350 |[Codepen](https://codepen.io/BreeChou/pen/ZExvNaX)|
|Nini Chen#5790 |[Codepen](https://codepen.io/ninistyle/pen/GRxQWNQ?editors=1000)|
|Cliff#4606 |[Codepen](https://codepen.io/Cliff_hex/pen/RwMQgXV?editors=1000)|
|Wei-Ting#7691|[Codepen](https://codepen.io/hellowei-ting/pen/ExEQomP)|
|sophiee#7015|[Codepen](https://codepen.io/sophiee2727/pen/BarYXVq)
|rueee#7997|[Codepen](https://codepen.io/Jull-C/pen/abYYLRq)
|鎔瑄#8578|[codepen](https://codepen.io/barbarayou/pen/dymmgyV) |
|kevin8349#6131|[codepen](https://codepen.io/kun8349/pen/MWVGQWN?editors=1010) |
| jason1#2538 | [codepen](https://codepen.io/jotwxezb-the-encoder/pen/yLKEyzx) |
| 紙飛機 #1335 | [codepen](https://codepen.io/paperplanea/pen/qBoKNYJ) |
| jeter#8014 | [codepen](https://codepen.io/gi-tai-she/pen/abYKQvy) |
| 肉魚#2149 | [codepen](https://codepen.io/zoechen13/pen/jOzpPog) |
| Manson許#2295 | [codepen](https://codepen.io/oupbzfxq-the-scripter/pen/GRxXWxJ) |
|Gui#9571|[CodePen](https://codepen.io/guitimliu/pen/wvmQyJz)|
|Rena#6249|[CodePen](https://codepen.io/aureate0116/pen/poLQBLy)|
|NathanJames#8120|[CodePen](https://codepen.io/ufo060204/pen/eYMQwYb)|
|瑞瑞 #4605|[CodePen](https://codepen.io/tsai-li-ting/pen/QWmzeeb)|
|jin.huang#4666|[CodePen](https://codepen.io/haha1196/pen/oNqmgWw)|
|郭芙蘭#6374|[CodePen](https://codepen.io/flora_Kuo/pen/VwXgLjV)|
|RuoAn#7124|[CodePen](https://codepen.io/LiauRuoAn/pen/xxWMNzj?editors=0110)|