用纯CSS3实现网页中常见的小箭头

/ 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-: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-: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-:5px solid transparent; / right arrow slant /
  border-left:5px solid #2f2f2f; / bottom, add background color here /
  font-size:0px;
  line-height:0px;
}