[CSS 3] Add a Cutout Notch to an HTML Element with a CSS Polygon Clip-Path

In this lesson, we'll learn how to use CSS Clip Path to add a notch

clip-path: polygon(
  0% 10%, 10% 0%, /*topleft*/
  92% 0, 100% 8%, /*top right*/
  100% 85%, 85% 100%, /*bottom right*/
  8% 100%, 0% 92% /*bottom left*/
); 

Each edge has two point to define the position.

原文地址:https://www.cnblogs.com/Answer1215/p/13397353.html