css3画个圆圈里的对号

效果如图

image.png

基本思路

1先画一个圆
2画两个位于圆中间的小矩形
3旋转矩形，一个左旋45度，一个右旋45度
4利用absolute进行定位。

<style>
        
    .demo2 {
        width:40px;
        height:40px;
        border-radius:40px ;
        background:black;
        display:block;
        position: relative; 
    }
    
    .demo2:before, .demo2::after {
        content:"";
        height:28px;
        width:6px;
        border-radius: 10px;
        display:block;
        background:white;
        position: absolute;
        top:6px;/*40-6=34*/
        left:20px;/*make the two rects in the middle of the cycle */
        transform:rotate(45deg);    
        -ms-transform:rotate(45deg);    
    }
    .demo2::before {
        height:15px;
        transform: rotate(-45deg);
        -ms-transform:rotate(-45deg);
        position: absolute;
        top:18px;/*40-18=12  */
        left:8px;       
    }

</style>
<span class="demo2"></span> 

总结

算像素还是挺费劲的，以后直接抄吧
去哪抄呢
CSS 3 Icons | CSS 3 Icons Generator | UIPlayGround