---
# System prepended metadata

title: "\U0001F3C5 5/5(四) 每日切版任務 - flex 練習"
tags: [公益程式體驗營 - 2022]

---

---
tags: 公益程式體驗營 - 2022
---

# 🏅 5/5(四) 每日切版任務 - flex 練習
## 問題 

* 用 Codepen 練習將兩個 box (各別是 300px * 300px 與 100px * 100px )置中置放:
* 只需要將兩個方形色塊水平與垂直置中即可，圖面上的文字為補助顏色與方形尺寸資訊，不需要將文字放進去喔
![](https://i.imgur.com/DTVJxaF.png)


<!--
ans:
[作業四](https://codepen.io/DoLucky/pen/KKQpJpm?editors=1100%29z)
-->
---

## 回報流程

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

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

<!-- 解答：  -->

回報區
---
<!-- 1. CloThEs
codepen . https://codepen.io/bogwdnxx-the-sans/pen/GRQJYxq
-->


<!-- 2. Lemon
codepen . https://codepen.io/shumhoyin/pen/GRQJYBj
-->

<!-- 3. yunyun
codepen . https://codepen.io/yun_yunni/pen/VwQLEGL
-->

<!-- 4. su#7798
codepen . https://codepen.io/wc-su/pen/BaYNqOR
-->

<!-- 5. Noy
https://codepen.io/MochiCodingPen/pen/poaJxqK
-->

<!-- 6. Tuhacrt#0008
Codepen:
https://codepen.io/Tuhacrt/pen/jOZPeZY
-->

<!-- 7. Aaron 
Codepen:
https://codepen.io/narrowd4c/pen/xxYbPxV 
-->

<!-- 8. JackC#0411  
Codepen:
https://codepen.io/key0329/pen/qBxdJzE?editors=1100
-->

<!--9. Eric.S
Codepen:
https://codepen.io/Eric_Shen/pen/gOvpQbR
-->

<!-- 10. hw#0715
Codepen:
https://codepen.io/Lhwei/pen/vYdOQOg 
-->

<!-- 11. Art
Codepen:
https://codepen.io/ss97202tw/pen/WNMvYQy
-->

<!-- 12. Bruno Yu
Codepen:
https://codepen.io/bruno-yu/pen/PoQqydW?editors=1100
-->

<!-- 13. Josh Chen#4552
Codepen:
https://codepen.io/hiphop825/pen/zYRGMNY?editors=1100
-->

<!-- 14. Wendy
codepen . https://codepen.io/wendy03/pen/bGLdQgK
-->

<!-- 15. kc_tw
codepen: https://codepen.io/kcwang-tw/pen/abqOQpO
-->

<!-- 16. Murmurline#6969
答案：不用flex,grid的練習
```
position: relative;
top: 50%;
left: 50%;
transform: translate(-50%, -50%)

```https://hackmd.io/vPQjg8axR_yz54LCnHoZow#
codepen: https://codepen.io/murmurline/pen/vYdOQym

 -->
 
 <!-- 17. Erica Chen#6929
codepen: https://codepen.io/ericachen/pen/XWZbyMr
-->

 <!-- 18. Erica Omi#3467
codepen: https://codepen.io/chian0501/pen/JjpdeMK
-->

<!-- 19. LHchien
 https://codepen.io/lin_chien/pen/bGLdQxQ -->
 
 <!--20. Lisa L.#0426
codepen: https://codepen.io/Lisa-Liao/pen/GRQJwjv -->

<!-- 21. shujhen#7734
codepen: https://codepen.io/shujhen/pen/MWQwzLY
-->
<!-- 22. ㄚ華
codepen:https://codepen.io/jzkonzat-the-typescripter/pen/dydoQZv

<!-- 23. Peng
    https://codepen.io/peng-027/pen/poaJqeg 
-->
 
<!-- 24. Patti chiu Patti#7774
https://codepen.io/peiru-qiu/pen/wvyaRzb
-->

<!-- 25. HiyukiOuO#8072
codepen：https://codepen.io/Befei/pen/KKQpbXV -->

<!-- 26.ozawa#8815
https://codepen.io/PIN-HSIN/pen/YzeXdxO -->

<!-- 27. 白白#8245
codepen: https://codepen.io/YuBai/pen/eYVNbyv
-->

<!-- 28. 眠欄#8857
CodePen:　https://codepen.io/laron9486/pen/QWQbzaj
-->

<!--  29. Hao#2485
https://codepen.io/hao216/pen/QWQbzvw
-->

<!-- 30. Cliff
https://codepen.io/Cliff_hex/pen/KKQpbBg
-->

<!-- 31. IreneLee
https://codepen.io/ntjtcxpt-the-animator/pen/bGLdOmd 
-->

<!-- 32. Vera#5592
https://codepen.io/skvera/pen/VwQLqVq?editors=1100
-->

<!-- 33. JustinLiu
Codepen: https://codepen.io/justin0227/pen/xxYGmWY?editors=1100
-->

<!-- 34. yuyu#6310
Codepen: https://codepen.io/yuyu0905/pen/NWyqeJN
-->

<!-- 35. NaRa#7954
Codepen: https://codepen.io/chou-nara/pen/yLvNGdX
-->

<!-- 36. Muse
Codepen: https://codepen.io/mu24/pen/mdXJvJb
-->

<!-- 37. 花禮湖燒#7359
codepen . https://codepen.io/lai-pei/pen/OJQVrqP
-->

<!-- 38. EVC#1876
39. Codepen: https://codepen.io/elvi-chuang/pen/mdXJvVd
40.  -->

<!-- 39. rejennylo
Codepen: https://codepen.io/reJennylo/pen/zYRGeBL
-->

<!-- 40. SASIMI #5099
Codepen: 
https://codepen.io/sashimi1327/pen/MWQwLmV 
-->

<!-- 41. 
Codepen: Elena Chang#0956
https://codepen.io/elena-chang/pen/ZErGVpO 
-->

<!-- 42. 
Codepen: Kiwi #9804
https://codepen.io/kiwi1113/pen/vYdObeE
-->

<!-- 43.
Lian Chen
Codepen:https://codepen.io/CCL1007/pen/RwQPvLP?editors=1100 -->

<!-- 44.小七拿鐵
Codepen:https://codepen.io/loqqikul-the-vuer/pen/rNJVPpZ-->

<!-- 45. Hsien#8395
Codepen:https://codepen.io/xnfpbplj-the-sasster/pen/XWZbOpB?editors=1100
<!-- 46. 翁來
Codepen:https://codepen.io/wguo8320/pen/BaYNMxW

<!-- 47. Arvin#6347
Codepen:https://codepen.io/family929317/pen/KKQpJxo?editors=1100 -->


<!-- 48. EG#7172
codepen: https://codepen.io/paneg-jpeg/pen/wvyaNOr
-->

<!-- 49. ms_kellychen#6947
codepen: https://codepen.io/KC1090901_W/pen/rNJVPbP
-->

<!-- 50. Mitour#0672
codepen:
https://codepen.io/mitour/pen/GRQJeKW?editors=0100
-->

<!-- 51. andersonshen#4675
codepen:
https://codepen.io/luxyenni-the-bold/pen/GRQJeoE 
-->

<!-- 52. Leo Song
codepen:
https://codepen.io/sunnylaba/pen/OJQVqjv
-->

<!-- 53. Vicky Lin 
codepen:
https://codepen.io/vicky850520/pen/wvyaOYY
-->

<!-- 54. Gwen
codepen:
https://codepen.io/gowan/pen/LYQVaMy
-->

<!-- 55. Yi#2702
codepen:
https://codepen.io/yic1823/pen/wvyaZyw
-->

<!-- 56. CCY#3639
codepen:
https://codepen.io/cyizumi/pen/MWQwRKK
-->

<!--  57. Chi
codepen: 
https://codepen.io/YoChi84/pen/GRQJLNw
-->

<!-- 58. Jill#5577
 CodePen:
https://codepen.io/Jillkate/pen/abqOxKE
-->

<!-- 59. Joyce#3790
 codepen:
https://codepen.io/joycehuang/pen/XWZbQQV?editors=1100
-->

<!-- 60. Nina泥#1422 
codepen:
https://codepen.io/xiangqi09020/pen/BaYNeao
-->

<!-- 61.deveryone#8090
codepen:
https://codepen.io/raycheng/pen/KKQpYeM
-->

<!-- 62. zzuhann #2786
codepen: https://codepen.io/zzuhann/pen/MWQwdaO
-->

<!-- 63. BeanHuang
codepen: https://codepen.io/Beanhuang/pen/yLvNWYo
-->

<!-- 63. Jenny_ #7314
codepen: https://codepen.io/Jenny_000/pen/KKQpLNv?editors=1100
-->

<!-- 65. 楓之聲#6945
codepen: https://codepen.io/sshane258/pen/KKQpLMq 
-->

<!-- 66. Nini Chen#5790
codepen: https://codepen.io/ninistyle/pen/ZErGZdX?editors=1100 
-->

<!-- 67. Lao#4012
codepen: https://codepen.io/rao418065/pen/LYQVoxv
-->

<!-- 68. qtrp#5635
codepen:
https://codepen.io/alicewu1991/pen/yLvNrKa?editors=1100
-->

<!-- 69. 米金#1399
https://codepen.io/ihrowjtq-the-vuer/pen/yLvNWbp
-->

<!-- 70. Bao
codepen:
https://codepen.io/baoh/pen/GRQJewd?editors=1100
-->

<!-- 71. 小鹿Kerwin#5730
codepen:
https://codepen.io/tkoleo84119/pen/qBxdGGB
-->

<!-- 72. Ayre #0016
codepen:
https://codepen.io/yichunlin09/pen/xxYGoxK
-->

<!-- 73. Van.CS #2067
codepen:
https://codepen.io/fbacojji-the-selector/pen/dydoBOp
-->

<!-- 73. Greta
codepen:
https://codepen.io/gretali/pen/bGLdZmQ
-->


<!-- 74. yen#5757 
codepen:https://codepen.io/TZU-HUANG-YEN/pen/VwQLJgM 

<!-- 75. lyle#8123
codepen:
https://codepen.io/tomys/pen/zYRGgBN
-->
<!-- 76. Vivian
codepen:
https://codepen.io/Vianhuang/pen/bGLdXqX
-->
<!-- 77. RJRS
codepen:
https://codepen.io/RJRS/pen/rNJVXjW
-->
<!-- 78. LiYiLing
codepen:
https://codepen.io/ritaling1021/pen/MWQwNoe
-->

<!-- 79. Chaoci#2460
codepen:
https://codepen.io/gmailchao/pen/LYQVwBr
-->

<!-- 80. Alphacostankion#8475
codepen:
https://codepen.io/alphapolo/pen/rNJVXKw
-->
<!-- 81. 鉦勝#8333
codepen:
https://codepen.io/atckmax823/pen/eYVpOmy
-->

<!-- 82. Mojito#6002
codepen: https://codepen.io/vu3xk41997/pen/qBxOWOQ
-->

<!--83  TunacanBoy#2206
https://codepen.io/JamesDesign/pen/JjpdVzB
-->

<!-- 84. Triple
 https://codepen.io/riku30/pen/bGLVbaq
-->

<!--85. LCC#9012
  https://codepen.io/pamelaxchun/pen/eYVpOGK
-->

<!--86.謏喀#2607
  https://codepen.io/s92475mark/pen/wvyKwrg?editors=1100
-->
<!--87.decoration red#7401
https://codepen.io/DECORATION/pen/jOZbOqv
-->

<!-- 88. Katie
 https://codepen.io/Katie24/pen/KKQdKMG
-->

<!-- 89. Knn#0492
 https://codepen.io/Knn_84/pen/RwQWwGp
-->

<!-- 90. sunny cheng#4113
  https://codepen.io/Sunny0509/pen/mdXedEm -->
  
  
<!-- 91 JOU JOU#6876
  https://codepen.io/joujoujou924/pen/xxYwxrw -->

  <!--color
https://codepen.io/color0602/pen/BaYoaRr
-->

<!-- 92 StellaHsu #2687
https://codepen.io/stella950114/pen/JjpYjZR
-->

<!-- 93 Lina Chen
https://codepen.io/LinaChen/pen/WNMQNaP
-->

<!-- 94 狸貓#9725
https://codepen.io/leeemo/pen/wvyKvmx
-->

<!-- 95 kuo
https://codepen.io/sunny-sun/pen/gOvaYBL
-->

<!-- 96 小櫻桃#9181
https://codepen.io/cherrylover/pen/NWyqgom
-->

<!-- 97 Ryan Lu
https://codepen.io/ryanlu1125/pen/NWyGWVJ
-->

<!-- 98 Arista 
https://codepen.io/arista-hsieh/pen/GRQpRbG
-->
<!-- 99 TAKO #3277
https://codepen.io/TAKOBEA/pen/GRQpRed
-->
<!-- 100 rubyruby
https://codepen.io/Ruby0831/pen/xxYwxmE?editors=1100
-->
<!-- 101 Jeanie
https://codepen.io/mizhongzaji/pen/WNMQbQq
-->

<!-- 101 Martin
https://codepen.io/chihsuanbjjh/pen/LYQpEWe
-->

<!--102 Jamie
https://codepen.io/Wu220103/pen/yLvNeMa
-->

<!--103 shino#8188
https://codepen.io/Shyun67/pen/jOZbEEg
-->

<!--103 Ning#6363
https://codepen.io/fangninglin/pen/zYRvxro
-->

<!--104 BeckyYo#1461
https://codepen.io/vicky850520/pen/wvyaOYY
-->

<!--104 隔壁小王
https://codepen.io/stevetanus/pen/LYQpEgB
-->https://www.gravatar.com/avatar/1b3c5061fdb6afdeb61b73478c054e28?s=96

<!--105 lengleng 
https://codepen.io/lengleng2/pen/eYVpmJZ
-->

<!--107 bonnieli1414#4906
https://codepen.io/bonnieli1414/pen/BaYoyva?editors=1100
-->

<!-- 108 小天#7177
https://codepen.io/linyujing/pen/YzeXdXL
我是用手機交作業，沒辦法貼上 QQ
如果有打錯網址，再跟我說一下，謝謝 ><
-->

<!-- 109 DoubleZ#2361
https://codepen.io/lazywyatt/pen/vYdNOBw 
-->

<!-- 110 Zooey#6634
https://codepen.io/noraneko0430/pen/zYRvxQR?editors=1100
-->

<!-- 111 Jia-Hong Chen#3863
https://codepen.io/iloveleon19/pen/LYQpEaJ
-->

<!-- 112 xuan#0808
https://codepen.io/xuan0915/pen/mdXeyKo?editors=1100
-->

<!-- 112 KER#8629 https://codepen.io/kerker000/pen/mdXeyMQ -->

<!-- 113 Jim#8764
https://codepen.io/jim255060/pen/QWQjbrq
-->

<!--114 Tin#7559
https://codepen.io/tinchen/pen/xxYwbBj
-->

<!-- 115 yuling
 https://codepen.io/igzdflpu/pen/jOZbPYG
-->

<!-- 116 阿基基
https://codepen.io/JIJI_GNI/pen/WNMQvZj
 -->
<!-- 117 LYC#5516
  https://codepen.io/chi-yen/pen/wvyKaPg-->
  
<!-- 117 muzz#0345
 https://codepen.io/yunnnz/pen/KKQpbNp-->
 
 <!-- 119 Data#9297
 https://codepen.io/kirakira72/pen/bGLVdbE-->
 
  <!-- 120 Chaco #2993
 https://codepen.io/chaco-wang/pen/WNMQvWd-->
 
<!--  121 J_u_d_y #5993 
https://codepen.io/J_u_d_y/pen/zYRvGPm?editors=1100
-->

<!-- 122 黑松胖#4836
 https://codepen.io/yi-chien-hsieh/pen/gOvabXE?editors=1100
-->

<!-- 122 mei#8421
 https://codepen.io/Shila-Chen/pen/XWZmmWQ?editors=0100
-->
 
<!--  123. AllenLi#6756
 https://codepen.io/knsybndf-the-animator/pen/VwQvLJe?editors=1100 -->
 
 <!--  124. Lam#0344
 https://codepen.io/manshun-lam/pen/zYRvGXb -->
 
<!-- 125. 白狐
Codepen：https://codepen.io/baihu7851/pen/YzeyyaQ
-->

<!-- 126 azami#5986
  https://codepen.io/azami/pen/RwQWWej
-->

<!-- 127 Stanley#3825
  https://codepen.io/sean_1215/pen/abqvveB
-->

<!-- 128 amy芳#1385
  https://codepen.io/amy-chieng/pen/VwQvvqz
-->

<!--129 Anren#9048
 https://codepen.io/Anren/pen/bGLVVjm
-->



<!--130 ling chang#1024
 https://codepen.io/ling-chang/pen/mdXeegx
-->

<!--130 雨天晴#2577
 https://codepen.io/aporitzp-the-vuer/pen/oNEjbEd
-->

<!--132 ChaoChao
 https://codepen.io/EmiiilyJ/pen/vYdNLyr
-->

<!--133 Tsuei#9284
https://codepen.io/AlbertoLL/pen/rNJOeOJ  
-->

<!--134 jada1109#8756
https://codepen.io/jada1109/pen/QWQjNQM?editors=1100
-->

<!--135 Nat#5891
https://codepen.io/dxnqcnen/pen/rNJOeYr
-->

<!--135 小不點#1793
https://codepen.io/fwmfmgkx-the-flexboxer/pen/dydYMgy
-->

<!--136 Winnie#1306
https://codepen.io/TzuHsuanWu/pen/rNJOLaR?editors=1100
-->

<!--137 菟小歆#2154  
https://codepen.io/catmoon1017/pen/jOZbrqp?editors=1100 -->

<!--138 _伊凡Evan  
https://codepen.io/Evan_9837/pen/MWQabyE
-->

<!--139 _諾拉#4800 
https://codepen.io/Naomi_riayun/pen/jOZbwdJ
-->

<!--140.hsiuhsiu#7412 
https://codepen.io/hsiuhsiu/pen/qBxOXVp
-->

<!--141. 炎炎 #0777
codepen: https://codepen.io/kimyen260/pen/xxYwZyY?editors=1100  
-->

<!--142. 阿偉#4995
codepen: https://codepen.io/azmfvbbz-the-sans/pen/JjpYywL
-->

<!--143. Jie Du
codepen: 
https://codepen.io/qgqonost-the-flexboxer/pen/YzeyxoB?editors=1100
-->

<!-- 144. danny123
codepen: https://codepen.io/binlandz123/pen/qBxOVmO
-->

<!-- 145. Lyndon.Su#6018
codepen: https://codepen.io/jvvkahjx-the-lessful/pen/XWZmzML
-->

<!-- 146. 肉桂卷#0625
codepen: https://codepen.io/ginnlee/pen/yLvYPWm?editors=1100
-->

<!-- 147. Easton#3863
codepen: https://codepen.io/EastonIsCodingNow/pen/WNMQdGq
-->
<!-- 148. Easton#3863
codepen:
https://codepen.io/Yu__hung/pen/mdXepLa
-->

<!-- 149. Abel
codepen:
https://codepen.io/lun_chi/pen/abqvqYQ
-->

<!-- 150. Charlotte Lee
codepen:
https://codepen.io/charlotte-lee/pen/PoQPQeN?editors=1100
-->

<!-- 151. Cynthia1111
codepen:
https://codepen.io/Cynthia1111/pen/dydYmzX
-->

<!-- 152. Vivi#5766
codepen:
https://codepen.io/hyxfish27/pen/JjpYLvG
-->

<!--
https://codepen.io/Adif/pen/MWQaBqd
-->

<!-- 153. Mylène
codepen:
https://codepen.io/hamajibashi/pen/ExQVdMr
-->

<!-- 154. Vicky Chang#8864
codepen:
https://codepen.io/cychang/pen/RwQWqGo?editors=1100
-->

<!-- 155. skypassion5000#4151
codepen:
https://codepen.io/skypassion5000/pen/oNEjJwo
-->


<!-- 156. bazingaga#0344
codepen:
https://codepen.io/Bazingaga/pen/XWZmLyW
-->

<!-- 157. ajhappy#6488
codepen:
https://codepen.io/ajhappy5438/pen/QWQyWmB
-->

<!-- 158. WilliamChou#7375
codepen:
https://codepen.io/williampo78/pen/RwQrNwj
-->

<!-- 159. 雷雷#7844
codepen:
https://codepen.io/lei-yi-jie/pen/jOZWEwg
-->


<!-- 160. RayChen#6088
codepen:
https://codepen.io/raychen1996/pen/eYVJmXg
-->

<!-- 160. 黑白兔＃0684
codepen:
https://codepen.io/johnny329/pen/VwQeLPg
-->

<!-- Newman
codepen:
https://codepen.io/newmankz/pen/BaYjNdo
-->

<!-- 163. 靜宜#6866
codepen:（可直接撰寫答案）
https://codepen.io/jamie18/pen/qBxbdGG
-->

<!-- 164. kk28976328#1197
codepen:
https://codepen.io/kk28976328/pen/gOvPaGR
-->

<!-- 165. 小羅#9921
codpen:
https://codepen.io/peizhen0609/pen/JjpjopV
-->

<!-- 166. KT#7274
5種區塊置中的方法
codepen:
https://codepen.io/pen/?editors=1100
-->

<!-- 167. carrieT#9628
codepen:
https://codepen.io/echocarriet/pen/xxYZVoB
-->

<!-- 168. Pie#8624
codepen:
https://codepen.io/Huishin-pie/pen/gOvPLXO-->

<!-- 169. 艾芮絲#6060
codepen:
https://codepen.io/wangyingju/pen/bGLEggo
-->

<!-- 170. 嘟嘟莉#2170
https://codepen.io/nicki202204/pen/abqdJQw
-->

<!--171. kevinCheng#3673
https://codepen.io/kevin760/pen/rNJxmxz
-->

<!-- 172. will0708#7730
https://codepen.io/ncrdpepc-the-lessful/pen/VwQeWVm?editors=1100
-->

<!-- 173 singend#0876
codepan:https://codepen.io/singend/pen/PoQZERx?editors=1100
-->

<!-- 174 Sussu#4211
codepan:https://codepen.io/yatiti84/pen/PoQZeoQ
-->


<!-- 175 Tori#1248
https://codepen.io/FlyTori/pen/xxYZjZO
 -->
 
<!-- 176 雪莉#0317
https://codepen.io/show113/pen/YzewLee
-->

<!-- 177 阿風#6890
https://codepen.io/Afong-Wind/pen/bGLEKmw?editors=1100
-->


<!-- 178 亞芽#1185 
https://codepen.io/sanahsu/pen/ExQPRzd
-->

<!-- 179 shiaohan#0676
https://codepen.io/shiaohan/pen/OJQMoor?editors=1100
--!>

<!-- 180 Cheng#3012
codepen:https://codepen.io/XiBinCheng/pen/dydGgGj
-->

<!-- 181. 拿鐵＃7585
codepen：https://codepen.io/qinsplanet1024/pen/JjpGmNZ
-->

<!-- 182 lazyhsu#6772
codepen：https://codepen.io/hsu860112/pen/rNJxggv
-->

<!-- 183 Cheng-Yu#1813
codepen：https://codepen.io/ball77111/pen/JjpGQjx
-->

<!-- 184 ( Φ ω Φ )#3092
codepen：https://codepen.io/rinnya/pen/poayzbb
-->

<!-- 185 jing#6810
codepen：https://codepen.io/jing2357/pen/QWQNWoB
-->

<!-- 186 Jan F#7277
codepen：https://codepen.io/Jan-F/pen/WNMraoQ
-->

<!-- 187 Ryan Chen#3338
codepen:
https://codepen.io/RyanTP/pen/OJQNyZg
-->

<!--188 Ivy Ivy#4403
codepen:
https://codepen.io/ivy0714lin/pen/ZErWQrY
-->

<!-- 189 Jumpye#8601
codepen：https://codepen.io/Jumpye/pen/QWQNyRL
-->

<!-- 190 Dun Dun#9857
codepen：https://codepen.io/dundun/pen/ExQKKgw
-->

<!-- 191.君Jyun#0147
codepen:https://codepen.io/Okaybeok/pen/WNMwGzm
 -->
 
 <!-- 192.安安你好你是誰#7416
codepen:https://codepen.io/leave3310-the-looper/pen/dydMpqV?editors=1100
 -->
 
<!-- 193. Carrie#2750
codepen:https://codepen.io/carrie-wang/pen/bGLpwJJ
 -->
 <!-- 194. han#9437
codepen:https://codepen.io/qnrxylcw-the-reactor/pen/GRQZdOQ
 -->
 
<!-- 195. Zoey#0839
codepen:https://codepen.io/zoec/pen/XWZdRKR
-->
<!-- 195. ton#8977
codepen:https://codepen.io/tonhan/pen/JjpXZML
-->

<!-- 196.MOMO#3370
codepen:https://codepen.io/chiuyuchun/pen/abqNaJv -->

<!-- 197.Marco Yin#2673
codepen:https://codepen.io/Marcoyin/pen/XWZdwpM
-->

<!-- 198. Chloeee#0035
codepen:https://codepen.io/beechloee/pen/JjpXgBR
-->

<!--199.piha#9987
codepen:https://codepen.io/pihahaha/pen/oNELvyM
-->

<!--200.EllieLo#9809
codepen:https://codepen.io/ellie-lo/pen/RwQRVje
-->

<!--201.教練#6451
codepen:https://codepen.io/monkeybear721/pen/gOvMRvP
-->

<!--202.yutingHsieh #0950
codepen:https://codepen.io/HsiehYuTing/pen/LYQZmoW
-->

<!--203 zera#6060
codepen: https://codepen.io/zera888/pen/VwQjBZq
-->

<!--204 H2CO3#7232
codepen: https://codepen.io/guan-zhen-wang/pen/abqNaGZ
-->

<!--205 Choo.Ku
codepen: https://codepen.io/chooku/pen/XWZjWdz?editors=1100
-->

<!-- 206 大衛
codepen: https://codepen.io/exnsrpjc/pen/MWQjYJP -->

<!-- 207 家洋#6999
codepen: https://codepen.io/yang940648/pen/abqmVja -->
<!-- 208 CHIA#3031
codepen: https://codepen.io/chiachiaD/pen/WNMGPrY?editors=1100-->

<!-- 208 gahwa#3562
codepen: https://codepen.io/gahwa17/pen/zYRKerG -->

<!-- 209 Susan8402#5854
codepen: https://codepen.io/Susan8402/pen/BaYLMWO -->


<!--210 judy0927#4241
codepen: https://codepen.io/judycxc/pen/gOvwqdB
-->
<!--211 steven421055
codepen: https://codepen.io/steven421055/pen/OJQbMdx
<!--212 jiajiajiahou#5229
codepen: https://codepen.io/chia-chia-hou/pen/vYdyeMj

<!--213 樂樂 #9345
codepen: https://codepen.io/sfkkpnik-the-selector/pen/ExQNQVx
-->

<!--214 Lynn73 #3164
codepen: https://codepen.io/LYNN0703/pen/BaYQxOZ
-->
<!--215 果凍 #0374
https://codepen.io/pbhdzjdb-the-bashful/pen/OJQbwyq  -->

<!--216 Cora #3153
https://codepen.io/coracola/pen/xxYRmOQ  -->

<!--217 YANSzero #5436
codepen: 
https://codepen.io/yanszero/pen/rNJWRoG?editors=0010
codepen:
 -->
 
 <!--218 一隻阿貓 #2726
codepen: 
https://codepen.io/chenchaoyen/pen/vYdyMQG
codepen:
 -->
 
<!--  219 whatsupcc#6486
 codepen:https://codepen.io/ccchian/pen/rNJWgxg -->
 
<!-- 220 Renad#0242
codepen:https://codepen.io/ruby-teng/pen/MWQbdQM
-->

<!-- 221 皆順#1616
codepen:https://codepen.io/koba60052ww/pen/rNJjNyj
-->    

<!-- 222.yuki#9465
codepen:https://codepen.io/yukilin549/pen/JjpEjNO?editors=1100
-->

<!-- 223.Jean
codepen:https://codepen.io/jean-liu/pen/eYVgZNX

<!-- 224.前面是彩色的#3025
https://codepen.io/mnscake/pen/RwQKpwm
-->


<!-- 225. YC#2008
Codepen: https://codepen.io/danisternburg/pen/BaYpbVe?editors=1100

<!-- 226. Sophia19#4005
Codepen:
https://codepen.io/sophia019/pen/vYdgqWr
-->


<!--227. Vito#7797
https://codepen.io/Vito_Yang/pen/gOvmYvx?editors=1100
-->

<!--228. CrystalD#6007
https://codepen.io/Crystaldu/pen/BaYWrNV
-->

<!--229. Ben Kao#3066
https://codepen.io/Ben-Kao0311/pen/vYdxOxX
-->

<!--230. Georgina#9761
https://codepen.io/9gina/pen/OJQmxJM
-->
<!--231. 青幻#9684
https://codepen.io/LYUYU/pen/abqyNQQ
-->

<!--232. Yurii#7455
https://codepen.io/Yurii-Wen/pen/dydzLZV?editors=1100
-->

<!--233. JessieCho
https://codepen.io/jessieCho/pen/eYVEaZv
-->

<!--234. bakiii
  https://codepen.io/aki168/pen/WNMZPZv
-->
<!--235. Jayrizon#8683
https://codepen.io/bghdxmmm-the-looper/pen/dydZGxV
-->

<!--236. Eileen#6454
https://codepen.io/Eileen-io/pen/KKQyGpO
-->

<!-- 237.Barret#1119
https://codepen.io/barret0720/pen/LYQrwWQ -->

<!-- 238.夜空#6305
https://codepen.io/sunnight0802/pen/dydjamB-->