平時我們需要三角形，大多數開發者都會選擇用圖形處理軟件做一個三角形。這雖然工作量不大；但是對於開發人員來說，有時你可能只是需要一個簡單的三角形；這個時候無論是自己打開圖形軟件做一個還是讓美工做一個給你，都可能會打斷你的思路，現在你再也不用為了一個簡單的幾何圖形而借助於圖形處理軟件了。因為用CSS就可以實現，而且非常簡單。
看看下面的圖片：
你可能覺得這並沒有什么，就算是一個初學圖形處理的同學也可以輕易的做出來；但是我要說的是，這些圖形都是使用CSS繪制出來的，沒有使用任何圖片；而且是放大縮小也不會失真。是不是很神奇呢？接着往下看，我將告訴你如何實現這樣的效果。
其實也沒什么，因為實現這樣的效果所使用的CSS就是“border”。只不過我們通過設置“border-width || border-style || border-color ”再加上“width和height”就可以實現各式各樣的形狀了。
我們先來做一個向右的三角形：
<div style="border-color: #FFF #FFF #FFF #000;border-style: solid;border-width:50px 0 50px 50px;width:0;height:0;"></div>
再來一個向左的：
<div style="border-color: #FFF #000 #FFF #FFF;border-style: solid;border-width:50px 50px 50px 0;width:0;height:0;"></div>
再來個向上的梯形：
<div style="border-color: #FFF #FFF #000 #FFF;border-style: solid;border-width:0 50px 50px 50px;width:50px;height:0;"></div>
是不是很簡單呢？趕快試試吧！
點擊這里下載包含圖片上所有行裝的源文件。