iT邦幫忙

鐵人檔案

第 12 屆 iT 邦幫忙鐵人賽
回列表
Modern Web

喪屍黑白切 系列

學習切版一段時間了,
紀錄一下這段時間學到的內容,
主要以金魚都能懂的網頁切版內容為主,
同時整理各種筆記,方便未來喪失記憶的時候複習。

鐵人鍊成 | 共 30 篇文章 | 7 人訂閱 訂閱系列文 RSS系列文
DAY 21

Day 21 | 這些人都是我的小弟...是員工 - 人員介紹卡片

今天要講的是金魚都能懂的網頁切版 : 人員介紹卡片 NO003。 本篇關鍵字 clip-path animation transform: tran...

2020-10-06 ‧ 由 Zombie@Dump 分享
DAY 22

Day 22 | 煩欸!我又忘記密碼了啦 - 登入表單

今天要講的是金魚都能懂的網頁切版 : 登入表單 NO017, 有沒有人跟我一樣超常忘記密碼的? 有些密碼重設還不能跟之前一樣, 然後我就每次都會忘記我新設定的密...

2020-10-07 ‧ 由 Zombie@Dump 分享
DAY 23

Day 23 | 是最後,但不是結束 - 頁尾

今天要講的是金魚都能懂的網頁切版 : 網頁頁尾版塊 NO006, 應該很少網頁沒有頁尾吧! 所以就把他學起來吧! 本篇關鍵字 :focus、outline...

2020-10-08 ‧ 由 Zombie@Dump 分享
DAY 24

Day 24 | 遙想那個用表格排版的年代

今天要講的是金魚都能懂的網頁切版 : 表格怎麼切 NO012, 聽說以前切版都是用表格切呢! 我是沒有經歷過那個年代啦~(裝嫩) 雖然現在切版不用表格切了, 但...

2020-10-09 ‧ 由 Zombie@Dump 分享
DAY 25

Day 25 | 不是古代的那種翻牌 - 翻牌效果

今天想要來講一下好像是滿常見到的翻牌效果, 不想一下提供太多資訊的時候,這算是一個還不錯的方式, 讓使用者 hover 到物件上時,再顯示出更多的訊息, 還能讓...

2020-10-10 ‧ 由 Zombie@Dump 分享
DAY 26

Day 26 | 打破規則,勇敢創新 - 破格式設計

今天要講的是金魚都能懂的網頁切版 : 破格式設計 NO011, 破格式的設計在很多樣版網站可以見到, 近期工作中也有接觸到, 滿多時候就是拿來製造兩物件重疊的效...

2020-10-11 ‧ 由 Zombie@Dump 分享
DAY 27

Day 27 | 等待的時間不無聊 - loader

今天想要分享的是這一個 Youtube 影片做出來的等待畫面, 我只有挑他的其中一個寫, 其他可以看他影片做做看。 loader 是個在網頁 render 前的...

2020-10-12 ‧ 由 Zombie@Dump 分享
DAY 28

Day 28 | 來組合個畫面吧 - Part 1

終於要來組合畫面嚕~ 寫了這麼多天的小區塊切版, 終於要派上用場了! 是不是常常有一種:「我想要學的是整個網頁的切版,不是這種小區塊!」的吶喊啊? 其實小區塊切...

2020-10-13 ‧ 由 Zombie@Dump 分享
DAY 29

Day 29 | 來組合個畫面吧 - Part 2

昨天稍微提了一些我切畫面時, 對 HTML 的規劃, 今天就來講 CSS 的部分啦! (鐵人賽剩一天好興奮啊~終於可以休息一下了) 在 CSS 撰寫習慣上, 有...

2020-10-14 ‧ 由 Zombie@Dump 分享
DAY 30

Day 30 | 鐵人賽完賽,切版之路未完 - 結語

第一次挑戰鐵人賽就寫兩邊, 老實說有想過兩邊就貼一樣的結語, 但想想還是有所不同, 決定還是乖乖的寫個結語, 都最後一天了, 再累也就這樣了。 今年整理了一些切...

2020-10-15 ‧ 由 Zombie@Dump 分享