---
tags: 2021 程式體驗營
---

# 6/16 每日任務 Day8

## HTML 任務題目
請修改[範例檔案](https://codepen.io/WangShuan/pen/XWMoezY)的 CSS 區塊完成以下三種設計：

1. 圖片大小預設為 800px
2. 將圖片大小在平版模式(768px 以下)設為 500px
3. 將圖片大小在手機版(500px 以下)設為 260px

示意圖：
PC:
iPad:
iPhone X

## JS 任務題目

請回答下方三道題目：

Q1 在撰寫 JS 判斷多個條件時當撰寫方式為 `if`+`else if`+`else` 的寫法，下方哪個選項錯誤？
A. 通常 `if` 一定是整個判斷式的開頭 後面才會是 `else if` 或 `else`
B. 判斷式都可以亂寫 順序也能亂排 次數隨便我開心 反正只要 console.log 沒報錯就好
C. 中間的 `else if` 可以重複出現多次用來判斷不同的條件

Q2 關於判斷中的條件式(即 if 判斷式 () 中的內容)，下方選項哪個說明正確？
A. 條件式中除了可以使用數字判斷條件(ex: a > 3) 也可以使用字串判斷是否有符合條件(ex: a == "John")
B. 條件式中只能使用數字判斷條件(ex: a > 3) 不能使用字串判斷是否有符合條件(ex: a == "John")
C. 判斷時條件式中只能寫 a == b 不能寫成 a = b 或 a === b

Q3 請看以下代碼回答 `console.log("今天我也美美噠～")` 是否會執行？以及為什麼會執行 or 為什麼不會執行？

let today = 6;

if (today === 1) {
  console.log("我要穿襯衫");
} else if (today === 2) {
  console.log("我要穿裙子");
} else if (today === 3) {
  console.log("我要穿吊帶褲");
} else if (today === 4) {
  console.log("我要穿踢恤");
} else if (today >= 5 && today <= 7) {
  console.log("抽籤決定要穿什麼好了");
}

console.log("今天我也美美噠～")

## 回報流程

1. 將答案貼在 Codepen 並複製 Codepen 連結貼至「回報區」回報
（也可以將答案直接貼至「回報區」）


## 作業回報區
<!--
1. WangShuan - 答案:

@media(max-width: 768px) {
  img{
    width: 500px;
  }
}
@media (max-width: 500px) {
  img{
    width: 260px;
  }
}

ＪＳ：Ｂ、Ａ、會，因為該行程式碼外面沒有撰寫任何判斷要求
-->
1. [雅琇 Alicia - HTML 作業](https://codepen.io/yahsiu-hsu/pen/ExWGpRa)
2. [Jane Lin - HTML & JS 作業](https://codepen.io/as60160/pen/MWpZqgg)
3. [Benson - HTML & JS 作業](https://codepen.io/polarBear712/pen/zYZybWO)
4. [Natsu小夏 - HTML 作業](https://codepen.io/natsunari/pen/xxqmBNV)
5. [BaoH - HTML & JS作業](https://codepen.io/baoh/pen/ExWGMJV)
6. [Katie -HTML作業](https://codepen.io/aria-mi/pen/KKWbYMO)
7. [Xing CT -HTML作業](https://codepen.io/xing10/pen/XWMoQbm?editors=0010)
8. [Lina Chen - HTML & JS作業](https://codepen.io/LinaChen/pen/YzZdMGY)
9. [明達在這 - HTML & JS]([https://](https://codepen.io/bmzpfyxe/pen/jOBXRGN?editors=0010))
10. [Sz - HTML & JS 作業](https://codepen.io/szyln/pen/ExWGzNE)
11. [Qian - HTML & JS 作業](https://codepen.io/qianhuiwei/pen/BaWvedj)
12. [LiMin - HTML & JS 作業](https://codepen.io/XuLiMin/pen/BaWveOL)
13. [阿丁兒 - HTML & JS 作業](https://codepen.io/dingpachan/pen/xxqmNve)
14. [ZY Hsu - HTML & JS 作業](https://codepen.io/zihyin/pen/KKWbLYZ?editors=1010)
15. [winnie - HTML & JS 作業](https://codepen.io/hsuanyu0115/pen/OJprebg?editors=1010)
16. [駱彥融 - HTML & JS 作業](https://codepen.io/yjluo/pen/abJPgrd)
17. [Will - HTML & JS 作業](https://codepen.io/WILL_Wu/pen/dyvwxGz)
18. [Yen - HTML & JS 作業](https://codepen.io/skxydvbs/pen/OJprKKK)
19. [Teddy Wu - HTML 作業](https://codepen.io/hongwei0522/pen/BaWMBWN?editors=1100)
20. [Mao - HTML & JS 作業](https://codepen.io/vsfvjiuv-the-typescripter/pen/JjWxPLe)
21. [coco li - HTML & JS 作業](https://codepen.io/corinna_li/pen/abJXbYb)
22. [袁祥恩](https://codepen.io/ovfxsavp-the-bashful/pen/gOmqOqo?editors=0010)
23. [HsiuTing - HTML & JS 作業](https://codepen.io/syutei/pen/vYxvVyw)
24. [Huana - HTML & JS 作業](https://codepen.io/hua_nan/pen/yLMZNBa)
25. [Nap－HTML & JS 作業](https://codepen.io/o0o0o1o0/pen/NWpoqRx)
26. [Null - HTML作業](https://codepen.io/Whale-Cat/pen/NWpoqXR?editors=1100)
27. [Erica Chen - HTML & JS 作業](https://codepen.io/ericachen/pen/gOmqaOw)
28. [Moto - HTML & JS 作業](https://codepen.io/moto-san/pen/NWpoPMZ)
29. [YOYO - HTML & JS 作業](https://codepen.io/lumedkle/pen/LYWqpKb?editors=1010)
30. [OAO - HTML & JS 作業](https://codepen.io/OAOAO/pen/WNpPrjW)
31. [yu shiuan chang HTML & JS 作業](https://codepen.io/prankaChang/pen/yLMZapy)
32. [William HTML - & JS 作業](https://codepen.io/hsuweihung/pen/LYWqROj)
33. [PinYin HTML - & JS 作業](https://codepen.io/PinYin/pen/QWpYdzV)
34. [Jeff H](https://hackmd.io/@jeff14994/r14E_cPjO)
35. [Anita HTML - & JS 作業](https://codepen.io/lcogkgva/pen/OJpdpVE)
36. [我是泇吟 - & JS 作業](https://codepen.io/kljuqbxs/pen/ZEewWPo)
37. [Haley - & JS 作業](https://codepen.io/wsx3690/pen/YzZBVMK)
38. [henry - HTML & JS 作業](https://codepen.io/henrymorgan666/pen/mdWvRWr)
39. [Joy Cheng - HTML & JS 作業](https://codepen.io/joycheng5432/pen/bGqzMZP?editors=0010)
40. [Yu](https://codepen.io/yuuuu4444/pen/xxqMzgW?editors=0011)
41. [Chung - HTML & JS 作業](https://codepen.io/chung_123/pen/eYvxPZv)
42. [Saiki - HTML & JS 作業](https://codepen.io/rostpfette/pen/PopVxgO)
43. [Sabrina](https://codepen.io/a120220ms25/pen/MWpLxXz)
44. [Hi Annie - HTML & JS 作業](https://codepen.io/lhohdalu/pen/xxqMeQd?editors=1111)
45. [Kelvin Wu - HTML & JS 作業](https://codepen.io/kai5363/pen/dyvroGK)
46. [Shiny - HTML & JS 作業](https://codepen.io/shinychen/pen/abJMOra)
47. [betty - HTML & JS 作業](https://codepen.io/betty-hu/pen/MWpxyKe)
48. [li li](https://codepen.io/lintapop/pen/GRWeRLE)
49. [Ting](https://codepen.io/veqnspek-the-decoder/pen/yLMwXRx)
50. [Ching hua - HTML & JS 作業](https://codepen.io/ching-hua-wang/pen/YzZgmaQ)
51. [Min - HTML作業](https://codepen.io/minnn7716/pen/NWpmWMg)
52. [Ken Chen-HTML&JS作業](https://codepen.io/ilovedriftcity168/pen/abJxzLO)
53. [三隻小貓 - HTML & JS 作業](https://codepen.io/bagelover/pen/dyvLYxY?editors=0110)
54. [林詠雯 - HTML作業](https://codepen.io/meimeilin/pen/ZEeZRVL)
55. [andyphl - HTML & JS 作業](https://codepen.io/andyphl/pen/YzZMdeN)
56. [LTL - HTML & JS 作業](https://codepen.io/ltlin93/full/ExWzmxV)
57. [jie -HTML&JS作業](https://codepen.io/jie333/pen/OJpYaOJ)
58. [drumrick - HTML & JS 作業](https://codepen.io/drumrick/pen/rNygbPg)
59. LoKing - [今日作業](https://codepen.io/loking23/pen/OJpKvLo)
60. [Min Chun Tsai - HTML & JS 作業](https://codepen.io/Tsai0926/pen/WNjNeXd)
61. [Overy - HTML & JS 作業](https://codepen.io/overy-tsai/pen/dyWybaM)
62. [蔡秉祐 - HTML & JS 作業](https://codepen.io/cwrzyhae-the-animator/pen/QWvWpvj)
63. [zong huan - HTML & JS 作業](https://codepen.io/wxsobwib-the-encoder/pen/poPovBr)
64. [Newman - HTML & JS 作業](https://codepen.io/newmankz/pen/vYmYpxV)
65. [chiachia- HTML 作業](https://codepen.io/chiachiaD/pen/LYyYQgY?editors=1100)