纯CSS写的小三角，支持自定义任何形状，方便修改，简单易懂!

看一下我自己写的效果，然后看代码，有注释可以自定义：

<view  class="box">
 <text class="open-icon1">
   <text class="icon-p1">|</text>
   <text class="icon-p2">|</text>
   <text class="icon-p3">|</text>
 </text>
</view>

.box {
  width: 91rpx;
  height: 42rpx;
  border: 6rpx solid #fff;
  border-radius: 33rpx;
  position: relative;
  z-index: 100;
}
.open-icon1{
  font-size: 52rpx;
  display: inline-block;
  color: #fff;
  position: absolute;
  top: 14rpx;
  left: 40rpx;
  transform: rotate(90deg);  //调整图形角度
}
.icon-p1 {
  transform: rotate(90deg);//旋转角度可以自由调整第1条边倾斜度来控制形状
  display: inline-block;

}
.icon-p2 {
  transform: rotate(147deg);//旋转角度可以自由调整调整第2条边倾斜度来控制形状
  display: inline-block;
  position: absolute;
  right: -9rpx;
  top: -14rpx;
}
.icon-p3 {
  transform: rotate(30deg);//旋转角度可以自由调整调整第3条边倾斜度来控制形状
  display: inline-block;
  position: absolute;
  top: -26rpx;
  right: 16rpx;
}