.linear{
200px;
height: 100px;
background: #58a;
background:
linear-gradient(135deg,transparent 15px,#58a 0) top left,
linear-gradient(-135deg,transparent 15px,#58a 0) top right,
linear-gradient(-45deg,transparent 15px,#58a 0) bottom right,
linear-gradient(45deg,transparent 15px,#58a 0) bottom left;
background-size: 50% 50%;background-repeat: no-repeat;
}
弧形切角的制作
.linear{
200px;
height: 100px;
background: #58a;
background:
radial-gradient(circle at top left,transparent 15px,#58a 0) top left,
radial-gradient(circle at top right,transparent 15px,#58a 0) top right,
radial-gradient(circle at bottom right,transparent 15px,#58a 0) bottom right,
radial-gradient(circle at bottom left,transparent 15px,#58a 0) bottom left;
background-size: 50% 50%;background-repeat: no-repeat;
}