css实现小三角

<div class="box sanjiao_border">
    <!--ie6下需用，非ie6无需-->
    <i class="before"></i><i class="after"></i>
</div>

.sanjiao_border:before,.sanjiao_border .before{/*.before为ie6下用到*/
    content: ''; /*伪类下的属性*/
    display:block;
    position:absolute;
    top:0px;
    left:150px;
    width:0;
    height:0;
    overflow:hidden;
    font-size: 0;     /*是因为, 虽然宽高度为0, 但在IE6下会具有默认的 */
    line-height: 0;  /* 字体大小和行高, 导致盒子呈现被撑开的长矩形 */
    border:10px;
    border-style:dashed dashed solid dashed;
    border-color:transparent transparent #f30 transparent;
}
.sanjiao_border:after,.sanjiao_border .after{/*.after为ie6下用到*/
    content: '';/*伪类下的属性*/
    display:block;
    width:0;
    height:0;
    overflow:hidden;
    font-size: 0;     /*是因为, 虽然宽高度为0, 但在IE6下会具有默认的 */
    line-height: 0;  /* 字体大小和行高, 导致盒子呈现被撑开的长矩形 */
    border:9px;
    border-style:dashed dashed solid dashed;
    border-color:transparent transparent #fff transparent;
    position:absolute;
    left:151px;
    top:2px;
}