伪类实现特殊图形,一个span加三角形

题目如图:

实现思路:

伪类+三边透明的三角形实现

 

代码:

<span class="wei">wei</span>

.wei{
display: inline-block;
width: 100px;
height: 100px;
background: gray;
position: relative;
}
.wei:after{
content: '';
position: absolute;
bottom: 0;
left: 100%;
border: 50px solid transparent;
border-left-color: gray;
}

 

伪类实现特殊图形,一个span加三角形

相关文章: