图标制作

.product-labels{
position: absolute;
top: 0;
left: 0;
z-index: 1;
padding: 0 3px;
color: #fff;
font-size: 1.0rem;
line-height: 18px;
background: #3a495a;
}
.product-labels:after{
content: " ";
position: absolute;
right: -6px;
top: 0;
width: 0;
height: 0;
border-top: solid 9px #3a495a;
border-right: solid 3px transparent;
border-bottom: solid 9px transparent;
border-left: solid 3px #3a495a;
}

<span class="product-labels">手机专享</span>

图标制作

原文：http://www.cnblogs.com/liangxuru/p/5957303.html