Vue实现一个长方形少一个三角形的样式（类似两个直角梯形摞在一起的样式）

<view class="flag-style"><view class="flag-text">哈哈哈</view></view>

<style lang="less">

.flag-style {

width: 100rpx;

height: 0rpx;

position: relative;

border: 30rpx solid #EBB904;

border-left:30rpx solid transparent;

        .flag-text{

                 position: absolute;

                right: -5rpx;

                 top: -25rpx;

                font-size: 30rpx;

                color: #fff;

        }

}

</style>

注：如果要是需要放在列表中，要将flag-style的样式修改成下面这样。 

.flag-style{

        width: 100rpx;

        height: 0rpx;

        position: absolute;

        right: 0rpx;

        top: 15rpx;

        border: 30rpx solid #EBB904;

        border-left:30rpx solid transparent;

}