clip-path: polygon矩形切角

作者: 逸笛 | 来源:发表于2023-02-27 14:23 被阅读0次

两个切角

图片.png

    .cover {
                
                width: 210rpx;
                height: 150rpx;

                clip-path: polygon(0 8px,
                        8px 0,
                        calc(100% - 8px) 0,
                        100% 8px,
                        100% calc(100% - 8px),
                        100% 100%,
                        0 100%,
                        0 calc(100% - 8px));

            }

四个切角

图片.png

clip-path: polygon(0 8px,
                            8px 0,
                            calc(100% - 8px) 0,
                            100% 8px,
                            100% calc(100% - 8px),
                            calc(100% - 8px) 100%,
                            8px 100%,
                            0 calc(100% - 8px));