鐵人檔案
30天，從wireframe到html，再到CSS，一步一步完成自己的一頁式履歷作品集網頁。
以前雖然在課堂上學過網頁程式撰寫，也設計過幾個project，但卻一直沒有式著製做自己的網頁，於是想趁著這個機會挑戰看看。
依照之前的html，目前有兩個關卡，三角形與量表，這次先說三角形。div是一個方形，透過border-radius 能將div 變成圓角矩形和圓形，但三角形呢？...
雖然先前使用html 的 <progress id= "file" value="32" max="10...
你好啊挑戰者，真沒想到你能一路到這裡呢，接下來就由我鎖鏈的時間軸當你的對手吧！時間軸大概分為兩個部分，中間的軸與兩旁的box，要先把box裡的內容排版起來，才能...
於是 timeline::after 就是設一個div 在timeline 後面，當作時間軸的中軸。要來繼續攻克時間軸囉！就剩最後一擊啦！首先用一個大div 把...
通過鎖鏈的時間軸之後，來到比較和藹可親的區塊了，這邊就是把文字與圖片做個排版，應該沒什麼特別的技巧。我將UI區塊設計成兩個部分，分為上方的Logo與mock-u...
繼續往下進行到使用資訊區的排版使用flex:row; 排版之後看起就完成三分之一了剩下設計與空間的調整 <div class="ui-zoo-i...
這篇會大量使用position 進行排版，但我一直跌進坑裡，不過也藉機更認識position的運作了，那就讓我們開始吧！ <div class="...
已經來到網頁最後的部分了，相片區與Footer。排版相片的部分很單調就是使用flex ，原本有想要添加一些酷炫的特效，但製作之後一方面覺得有些妨礙閱讀，一方面發...
嘿不知不覺的就來到倒數第二篇了呢！網頁也寫完了呢！是不是要發布了哇！今天就來說說 Github page 這個超簡單又免費的發佈功能吧！ 1. 建立新的Repo...
最後一天了就來寫個後記吧！感謝有看到最後的各位，能忍受我的超新手網頁程式分享。鐵人賽真的是一大挑戰，要每天發文、每天激勵自己與精進自己。 不像這比賽裡的其他大神...
