background: url("example.jpg") center no-repeat;
.clip { position: relative; display: inline-block; clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); }
其中,polygon()函数接受一系列坐标点,并将这些点依次连线形成一个多边形。在这里,我们创建一个矩形的四个顶点坐标。
另外,需要注意的是,clip-path属性目前在一些浏览器上的支持度还比较低,需要在使用时进行浏览器兼容性测试。