CSS实现带边框的切角和角标

在CSS中使用的路径裁剪clip-path时候会把边框一起切掉，解决这个问题思路是把切除的边框通过伪元素补上：

.bg {
   position: absolute;
   inset: 0;
   border: 1px solid #43e3b7;
   background-image: linear-gradient(-90deg, rgba(30, 225, 172, 0.4), transparent);
   clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);

     &::before,
     &::after {
        content: "";
        position: absolute;
        width: 15px;
        height: 3px;
        background-color: #43e3b7;
        transform: rotate(-45deg);
     }

     &::before {
        top: 2px;
        left: -4px;
     }
}