在網路上發現一篇文章 CSS Border Art,講的是用邊線組圖的方法,其中有幾幅令人讚嘆的作品。此練習參考 Slants,示範一些簡單的圖案做法。第一個範例顯示將 width, height 都設為 0px,就可以製成方形。其中 line-height:0px 必須設,否則 IE6 無法產生方形。
三角形的做法。上例中的第三圖是作圖的基礎,只要將部分邊線的顏色改為 transparent 就可作出三角形。由於 IE6 不支援 transparent,請用背景色取代 transparent。
梯形的做法。
直線的做法。這需要將兩個 DIV 疊在一起,才能畫出直線。IE6 不支援 transparent 所以無法作出直線。
國王的畫像。作一個簡單的國王畫像。由於 IE6 沒有支援 transparent,所以畫像不完整。
有作品時,歡迎留言告知,讓大家欣賞一下。
- 相關文章:
- border art 的應用:背景圖。
- 房子。