用border画小三角形的原理：div宽高为0，把border的一条边设置实线和颜色，通过控制不同边的显示，画不同方向的三角形。
<html>
<style type="text/css">
.test1{
width:0px;
height:0px;
border-style:solid;
border-width:10px;
border-color:red blue green pink;
}
</style>
</head>
<body>
<div class="test1"></div>
</body>
</html>
运行结果：
<html>
<head>
<style type="text/css">
.test1{
width:0px;
height:0px;
border-style:solid dashed dashed dashed ;/*设置dashed为了兼容ie浏览器*/
border-width:10px;
border-color:red transparent transparent transparent;/*只有上部分有颜色*/
}
</style>
</head><body>
<div class="test1"></div>
</body>
</html>
运行结果：
用border画小三角形OK。