使用background渐变处理卡片内切角样式

width: 400px;
height: 280px;
background: 
    radial-gradient(circle at 0% 0%, transparent 30px, red 30px) 0% 0%,
    radial-gradient(circle at 100% 0%, transparent 30px, red 30px) 100% 0%,
    radial-gradient(circle at 100% 100%, transparent 30px, red 30px) 100% 100%,
    radial-gradient(circle at 0% 100%, transparent 30px, red 30px) 0% 100%
;
background-repeat: no-repeat;
background-size: 50% 50%;

width: 400px;
height: 280px;
background: 
    radial-gradient(circle at 0% 50%, transparent 30px, blue 30px) 0% 50%,
    radial-gradient(circle at 100% 50%, transparent 30px, blue 30px) 100% 50%
;
background-repeat: no-repeat;
background-size: 50%;