纯CSS 画斜线 画小信封图标

欢迎转载，请注明出处。 https://blog.csdn.net/qq_42440234/article/details/85098221

hmtl代码

<div class="envelope">
     <div class="envelope_item"></div>
     <div class="x"></div>
     <div class="f"></div>
     <div class="c"></div>
</div>

css代码 envelope中的margin-left与margin-top可以忽略掉或者根据实际情况更改。

x为右侧的斜线,f为左侧的斜线,c为两个斜线的连接处。

.envelope{
    background-color: white;
    margin-left: 90%;
    margin-top: -2.2%;
    height: 25px;
    width: 43px;
    border-radius:2px;
}

.envelope_item{
    position: absolute;
    border-radius:2px;