# **自主學習** ![](https://i.imgur.com/yf7FVCK.jpg) 首先是html的部分 ![](https://i.imgur.com/Dm8TznW.jpg) ![](https://i.imgur.com/6NTcIiS.jpg) ![](https://i.imgur.com/mubCOrX.jpg) 大致上分為3個區域: 第一個是上方白色的部分 最後是最下面灰色的部分 其餘的部分我是當作第二部分 再來說明一下，第一部分還要再拆成左右兩邊；第二部分拆成圖片、搜尋框 緊接著就是修改css即可 ![](https://i.imgur.com/6USlzWc.jpg) 讓其垂直致中(因為我是綁死的->px)