任何人都可以帮助我通过CSS绘制这个图标吗？

Question

我不太了解如何通过CSS创建图标,但我只想知道是否有一种方法可以使用它绘制上面的图标.

Answer 1

是!

那就是说,有没有特别的理由不使用和图像,图标或字形？

小提琴

HTML

<div></div>

CSS

div {
    border-radius:999px;
    height:100px;
    width:100px;
    background:#59ABD5;
    position:relative;
    display:inline-block;
}
div:before, div:after {
    position:absolute;
    display:inline-block;
    content:'';
    background:white;
    border-radius:5px;
}
div:after {
    left:45px;
    width:8px;
    height:45px;
    top:10px;
}
div:before {
    left:18px;
    width:40px;
    height:8px;
    top:60px;
    -webkit-transform: rotate(-50deg);
    -moz-transform: rotate(-50deg);
    -o-transform: rotate(-50deg);
    transform: rotate(-50deg);
}