這也是在解第三題時產生的需求,因為原始素材中少了許多圖檔,包括左右箭頭,雖然老師是直接開PS來直接畫一個,不過我想了一下,似乎直接用CSS來快速產生一個三角形會更快一些,利用的原理是block邊框的特性,css的邊框預設是會以45度角的方式來連接,這個設計的特色在於我們可以透過設定邊框的顏色就快速產生一個按鈕的區塊出來,省掉不少美術的工作,因此很多新的網頁設計都會利用這個特性來產生簡易的幾何圖形,取代傳統美術需要製作一堆icon的工作,
我直接附上css的原始碼及變化過程的截圖,就不再多做文字解釋了,相信看完就能明白
除了三角形,利用border-radius屬性還可以產生圓形,更可以組合多個block來產生各種幾何圖形,更多變化,大家可以自己再去研究。
留言