css中用边框做三角形

css中用边框做三角形：

 行元素要转为块元素：display：inline-block/block

宽高度为0

倒三角

span{

border-top:#fff 10px solid;
border-bottom:transparent 10px solid;
border-left:transparent 10px solid;

border-right:transparent 10px solid;

     }

正三角

span{
border-bottom:#fff 10px solid;
border-top:transparent 10px solid;
border-left:transparent 10px solid;

border-right:transparent 10px solid;
     }

右三角

span{
border-left:#fff 10px solid;
border-top:transparent 10px solid;
border-bottom:transparent 10px solid;

border-right:transparent 10px solid;
     }

左三角 

span{
border-right:#fff 10px solid;
border-top:transparent 10px solid;
border-bottom:transparent 10px solid;

border-left:transparent 10px solid;
     }