跨瀏覽器相容之「三角形」語法（此語法在 IE6、IE8、Firefox5、Chrome12 中實測無誤）：
<div class="arrow-up"></div>
<div class="arrow-down"></div>
<div class="arrow-right"></div>
<div class="arrow-left"></div>
<style type="text/css">
.arrow-up {
width:0px; height:0px; border:5px solid; border-color:transparent transparent black transparent;/
border-style:dashed dashed solid dashed;
//向上三角形
}
.arrow-down {
width:0px; height:0px; border:20px solid; border-color:#f00 transparent transparent transparent;/
border-style:solid dashed dashed dashed;
//向下三角形
}
.arrow-right {
width:0px; height:0px; border:60px solid; border-color:transparent transparent transparent green;/
border-style:dashed dashed dashed solid;
//向右三角形
}
.arrow-left {
width:0px; height:0px; border:10px solid; border-color:transparent blue transparent transparent;/
border-style:dashed solid dashed dashed;
//向左三角形
}
</style>
範例效果：
參考網站:
http://www.36ria.com/demo/triangle/
http://cssshare.com/1/chun-csssan-jiao-xiao-guo-dai-ma
範例效果：
向上三角形
向下三角形
向右三角形
向左三角形
參考網站:
http://www.36ria.com/demo/triangle/
http://cssshare.com/1/chun-csssan-jiao-xiao-guo-dai-ma