具體的做法是對一個矩形，設置border，并將width和height設置為0，即可模擬出箭頭形狀（三角形）。 如下圖所示繪制了一個矩形，并將矩形的width和height設置為0，border設置為100px：

相關CSS:

border-left:100px solid #F00;
border-right:100px solid #F00;
border-top:100px solid #00F;
border-bottom:100px solid #00F;
width:0;
height:0;

上面的其實就是四個矩形，分別是上下左右四個方向，如果我們想要某一個方向的矩形，就可以將它相鄰兩側的border-color設置為transparent,對側不設置border

第一個箭頭的CSS，其余的類似：

border-left:100px solid transparent;
border-right:100px solid transparent;
border-bottom:100px solid #00F;
width:0;
height:0;

下面是一個箭頭的Demo：
PS: 2012-6-1
IE6不支持transparent，因此上面的代碼在IE6加一點處理透明的hack，修改后的代碼如下

border-left:100px solid transparent; border-right:100px solid transparent; _border-left:100px solid black; _filter:chroma(color=black); _border-right:100px solid black; _filter:chroma(color=black); border-bottom:100px solid #00F; width:0; height:0;