css 如何写排序三角形箭头

如何使用css编写三角形：
/* css3三角形（向上 ▲） /
div.arrow-up {
width:0px;
height:0px;
border-left:5px solid transparent; / 右透明 /
border-right:5px solid transparent; /右透明 /
border-bottom:5px solid #2f2f2f; / 定义底部颜色 /
font-size:0px;
line-height:0px;
}
/ css3三角形（向下 ▼） /
div.arrow-down {
width:0px;
height:0px;
border-left:5px solid transparent;
border-right:5px solid transparent;
border-top:5px solid #2f2f2f;
font-size:0px;
line-height:0px;
}
/ css3三角形（向左） /
div.arrow-left {
width:0px;
height:0px;
border-bottom:5px solid transparent; / left arrow slant /
border-top:5px solid transparent; / right arrow slant /
border-right:5px solid #2f2f2f; / bottom, add background color here /
font-size:0px;
line-height:0px;
}
/ css3三角形（向右） /
div.arrow-rightright {
width:0px;
height:0px;
border-bottom:5px solid transparent; / left arrow slant /
border-top:5px solid transparent; / right arrow slant /
border-left:5px solid #2f2f2f; / bottom, add background color here */
font-size:0px;
line-height:0px;
}