答案是 1 个标签即可!
//css部份
//主体部份
.icon-wexin{
display:inline-block;
width:64px;
height:64px;
position:relative;
background:radial-gradient(circle at50%50%,#08c406 5%,transparent6%)141%60%,radial-gradient(circle at50%50%,#08c406 5%,transparent6%)64%60%,radial-gradient(circle at50%50%,#08c406 7%,transparent8%)64%19%,radial-gradient(circle at50%50%,#08c406 7%,transparent8%) -12%19%,radial-gradient(at50%50%,#fff 46%,transparent47%)104%77%,radial-gradient(at50%50%,#08c406 50%,transparent51%)104%77%,radial-gradient(at50%50%,#fff 60%,transparent61%)20%38%,#08c406;
border-radius:3px;
background-size:70%58%;
background-repeat:no-repeat;
}
//两个小角的公共部份
.icon-wexin:before,
.icon-wexin:after{
content:' ';
display:block;
position:absolute;
background:#fff;
width:10%;
height:10%;
}
//左边的小角
.icon-wexin:before{
left:20%;
top:62%;
clip-path:polygon(47%0%,100%52%,0 100%);
-webkit-clip-path:polygon(47%0%,100%52%,0 100%);
}
//右边的小角
.icon-wexin:after{
left:72%;
top:73%;
clip-path:polygon(70%0%,100%100%,11%50%);
-webkit-clip-path:polygon(70%0%,100%100%,11%50%);
}
//html部份
<b class="icon-wexin"></b>
注:因为采用了css3最新特性,请仅在移动端和高级浏览器中使用!