huaban (11).png
CSS
/*基础样式*/
i,div,p,span{
display:block;
width:1em;
height:1em;
}
/*加*/
.add {
display: inline-block;
background: linear-gradient(90deg, transparent 44%, #454545 42%, #454545 56%, transparent 0%), linear-gradient(0deg, transparent 44%, #454545 42%, #454545 56%, transparent 0%);
}
/*减*/
.minus {
display: inline-block;
background: linear-gradient(0deg, transparent 42%, #454545 0%, #454545 57%, transparent 0%);
}
/*乘*/
.multiply {
display: inline-block;
border-radius: 30%;
background: linear-gradient(45deg, transparent 45%, #454545 45%, #454545 55%, transparent 55%), linear-gradient(-45deg, transparent 45%, #454545 45%, #454545 55%, transparent 55%);
}
/*除*/
.except {
display: inline-block;
background: linear-gradient(0deg, transparent 42%, #454545 0%, #454545 57%, transparent 0%), radial-gradient(circle at 50% 18%, #454545 12%, transparent 00%), radial-gradient(circle at 50% 83%, #454545 13%, transparent 00%);
}
HTML
<i class="add"></i>
<div class="minus"></div>
<b class="multiply"></b>
<span class="except"></span>
