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

# 🏅 6/3 (五) 每日切版任務 - background / position 練習 端午節快樂
## 題目

* 用 Codepen 練習以下畫面，相關尺寸、顏色等，請自行設計喜歡的大小跟顏色，但相關的圖型要如下圖喔!!

[粽子圖](https://upload.cc/i1/2022/05/26/rBOaGA.png)，想挑戰超級進階的學員，可以試著將粽子圖用程式碼寫出來喔!

圖的大小可以自訂，畫面最基本要像下列完成圖，若想再加多一些背景，可以自行設計喔!

>**色票資訊**
>

>**完成圖**
>

<!--
ans:
[position](https://codepen.io/DoLucky/pen/MWQOzyv?editors=1100)
-->
---

## 回報流程

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


<!-- 解答： -->

回報區
---

<!-- 1.IreneLee
codepen:https://codepen.io/ntjtcxpt-the-animator/pen/MWQXpKj?editors=1100
-->

<!-- 2.RJRS#9430
codepen: https://codepen.io/RJRS/pen/poaKewE
-->

<!-- 3. Noy
https://codepen.io/MochiCodingPen/pen/gOvKWBW
-->

<!-- 4. How #5806
codepen:https://codepen.io/howtobefine/pen/dydKWQG
-->

<!-- 5.Joyce
https://codepen.io/joycehuang/pen/YzevNOe?editors=1100
-->

<!-- 6.yunyun
https://codepen.io/yun_yunni/pen/rNJKwOX
-->

<!-- 7.小不點#1793
Codepen:https://codepen.io/fwmfmgkx-the-flexboxer/pen/XWZYgdW
-->

<!-- 8. lyle#8123
Codepen:https://codepen.io/tomys/pen/LYQrLOW?editors=1100
-->

<!-- 9. 雷雷#7844
Codepen:https://codepen.io/lei-yi-jie/pen/mdXKBgW
-->

<!-- 10. Tuhacrt#0008
https://codepen.io/Tuhacrt/pen/NWyzwdO
-->

<!-- 11. hw#0715
https://codepen.io/Lhwei/pen/ZErRayz
-->

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

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

<!-- 14.Chi
Codepen: https://codepen.io/YoChi84/pen/dydKdKo
-->

<!-- 15. yuyu#6310
Codepen: https://codepen.io/yuyu0905/pen/GRQGGGN?editors=1100
-->

<!-- 16. EllieLo#9809
Codepen: https://codepen.io/ellie-lo/pen/eYVKEoy
-->

<!-- 17. ajhappy#6488
Codepen:https://codepen.io/ajhappy5438/pen/JjpZqbx
-->

<!-- 18.RayChen#6088
Codepen: https://codepen.io/raychen1996/pen/GRQBqMO
-->

<!-- 19.hsiuhsiu
Codepen: https://codepen.io/hsiuhsiu/pen/wvyxzgb
-->

<!-- 20. 眠瀾#8857
CodePen: https://codepen.io/laron9486/pen/MWQXpVm
-->

<!-- 21. Cynthia1111
CodePen: https://codepen.io/Cynthia1111/pen/ExQpdwe?editors=1100
-->

<!-- 22. Hao#2485
https://codepen.io/hao216/pen/MWQqpmw
-->