纯CSS斜边框

效果如图：

代码：

li {
          display: inline-block;
          margin: 0 10px 10px 0;
          padding: 0 10px;
          height: 24px;
          line-height: 24px;
          background-color: #F7F8FC;
          border-radius: 2px;
          position: relative;
          background-color: $viceColor;
          color: $mainColor;
          margin-right: 5px;
            &::after {
              content: "";
              position: absolute;
              top: 0;
              right: -4px;
              border-width: 24px 4px;
              border-style: solid;
              border-color: $viceColor transparent transparent transparent;
            }
}

这样就是实现啦一个斜边框，同理再实现右侧div的斜边框