### 題目
運用 keyframes 試著呈現出第八週首頁上方旋轉動畫吧！


> 需讓動畫具有連續性
>
> 提示：
> - rotate 旋轉
> - [animation-timing-function](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-timing-function)

HTML：

<div class="container mt-3">
  <img src="https://github.com/hexschool/2022-web-layout-training/blob/main/week8-ai/circle.png?raw=true" alt="ALPHABOX+" class="alphaboxCircle img-fluid mx-auto">
</div>

CSS：

body {
  background-color: #7000FF;
}

img {
  display: block;
}

.alphaboxCircle {
  width: 196px;
  animation-name: rotate;
  animation-duration: 4s;
  animation-timing-function: ...;
  animation-iteration-count: infinite; 
  animation-fill-mode: both; 
}

@keyframes rotate {
  0% { ... }
  100% { ... }
}

> 記得載入 [Bootstrap CDN](https://getbootstrap.com/docs/5.3/getting-started/introduction/#cdn-links)

## 回報流程

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


<!-- 解答：
https://codepen.io/hexschool/pen/rNQXbrP
-->

回報區
---

|#| Discord | CodePen / 答案 |
|:--:|:------------:|:-------------------------------------------------------------------:|
| 01 | 銀光菇 | [Codepen](https://codepen.io/genesynthesis/pen/NWexdyy) |
| 02 | kuanju27 | [Codepen](https://codepen.io/Eero-Chiao/pen/bGOEgLa) |
| 03 | Tami | [Codepen](https://codepen.io/wqsdqbjn-the-vuer/pen/abPdpqe) |
| 04 | ann6212 | [Codepen](https://codepen.io/yqmegupa-the-styleful/pen/yLGegjR) |
| 05 | Rochel | [Codepen](https://codepen.io/rochelwang1205/pen/ExGPZRq) |
| 06 | Berlin | [Codepen](https://codepen.io/3qberlin/pen/oNJbByb) |
| 07 | pinyi_9 | [Codepen](https://codepen.io/Wpypy/pen/LYMGxrp) |
| 08 | shcopy | [Codepen](https://codepen.io/shcopy/pen/zYyrNLV) |
| 09 | Yu | [Codepen](https://codepen.io/yuch3n_chen/pen/bGOEgmv) |
| 10 | hebin. | [Codepen](https://codepen.io/landyhsiao776/pen/eYbJgba)|
| 11 | hannahTW | [Codepen](https://codepen.io/hangineer/pen/rNoxjQg) |
| 12 | Amelia | [Codepen](https://codepen.io/Amelia-chin/pen/vYvLgom?editors=1100) |
| 13 | bf_tsai | [Codepen](https://codepen.io/BF-Tsai/pen/RwErKqp) |
| 14 | townyuan | [Codepen](https://codepen.io/townyuan/pen/qBLbrda) |
| 15 | AYA | [Codepen](https://codepen.io/NoNameNote/pen/XWoXMRX) |
| 16 | m_m | [Codepen](https://codepen.io/minnn7716/pen/zYyrZzq) |
| 17 | ovo.yun | [Codepen](https://codepen.io/yun-the-scripter/pen/eYbJvLZ) |
| 18 | ChrisSQR| [Codepen](https://codepen.io/ChrisSQR/pen/YzdwZLe) |
| 19 | Vic_Liou| [Codepen](https://codepen.io/allenliou-java/pen/ExGPWGW) |
| 20 | ming0712| [Codepen](https://codepen.io/StevenHuang/pen/qBLbrvV) |
| 21 | lychee_kk | [Codepen](https://codepen.io/kakakala/pen/ExGPWzX) |
| 22 | Moreene |[CodePen](https://codepen.io/Moreene/pen/bGOEWEG)|
| 23 | hao2485 |[CodePen](https://codepen.io/Seanfeb16/pen/ZEVQKBK)|
| 24 | deli0529 | [Codepen](https://codepen.io/delichaomoon/pen/bGOVmZq)|
| 25 | ryan_chou | [Codepen](https://codepen.io/csw8524/pen/ZEVQyeM) |
| 26 | jia yu | [Codepen](https://codepen.io/fjqxaznl-the-reactor/pen/oNJbeyG) |
| 27 | markchen_ | [Codepen](https://codepen.io/Mark-JJchen/pen/OJrMpBd?editors=1100) |
| 28 | santu0868 | [Codepen](https://codepen.io/HatsumiSan/pen/OJrMjKG) |
| 29 | adele6199 | [Codepen](https://codepen.io/codepen-io-winnie/pen/NWexaMr) |
| 30 | yunhsinnnnnnn | [Codepen](https://codepen.io/yun___hsin/pen/WNLrXYJ) |
| 31 | jacky7035 | [Codepen](https://codepen.io/adens123/pen/PoXZEPQ) |
| 32 | yu.t_liu | [Codepen](https://codepen.io/YuT200053/pen/wvRMyBV) |
| 33 | swalok47716 | [Codepen](https://codepen.io/swalok/pen/oNJbqOx) |
| 34 | soniawu | [Codepen](https://codepen.io/YUJOU/pen/MWZKZwR) |
| 35 | meowmeow | [Codepen](https://codepen.io/snow1224/pen/vYvLbQw) |
| 36 |Kimi | [Codepen](https://codepen.io/kimihu91/pen/GRPoagw) |
| 37 | jules_hsu | [Codepen](https://codepen.io/cjntfsoq-the-animator/pen/eYbZpRj) |
| 38 | wind | [Codepen](https://codepen.io/wind7y/pen/bGOpVmY) |
| 39 | .icesam | [Codepen](https://codepen.io/icesam/pen/WNLwOKX) |
| 40 | Ann Chou | [Codepen](https://codepen.io/annchou_illu/pen/LYMGzmX) |
| 41 | orias_000 | [Codepen](https://codepen.io/qoq77416416/pen/NWeNJGr) |
| 42 | runweiting | [Codepen](https://codepen.io/weiting14/pen/NWeraXQ) |
| 43 | lishuan | [Codepen](https://codepen.io/lishuan/pen/ExGgVrd) |
| 44 | Renee Wang | [Codepen](https://codepen.io/Renee-Wang-2022/pen/YzdGQQB) |
| 45 | Tina02 | [CodePen](https://codepen.io/chjitlox-the-bashful/pen/MWZjEvW) |
| 46 | 小夏 | [Codepen](https://codepen.io/michaelhsia/pen/GRPrZZW?editors=1100) |
| 47 | RX00#5351 | [Codepen](https://codepen.io/llqzknqv-the-styleful/pen/OJrWoMJ) |
| 48 | Randy | [Codepen](https://codepen.io/landy510/pen/BavWjBX?editors=1100) |
| 49 | Long | [Codepen](https://codepen.io/Loonng/pen/XWoMRgO) |
| 50 | 歐陽龍龍#1061 | [Codepen](https://codepen.io/dizzydog-rgb/pen/poqPGze) |
| 51 | yuan2781 | [Codepen](https://codepen.io/ismebir/pen/gOZGzze) |
| 52 | tanuki5863 | [Codepen](https://codepen.io/tanuki320/pen/LYMQQRN) |
| 53 | patrickpie | [Codepen](https://codepen.io/patrickpie/pen/MWZVdpz) |

- 快速複製

|  |  | [Codepen]() |