css剪裁区 |css带图标横向二级导航菜单

.example
{
clip-path: polygon(0 0, 100% 0%, 100% 80%, 0 100%);
}

上面的代码会将指定的元素剪裁成一个梯形形状。这里的函数接受一组坐标点，用于定义裁剪路径的形状。使用这种方式可以实现更加复杂的形状，比如圆形、钻石形等等。

.example
{
clip-path: circle(50% at 50% 50%);
}

上面的代码会将指定元素剪裁成一个圆形。使用函数可以同时指定圆心坐标和半径。如果将半径设置为50%，则刚好可以剪裁成整个元素。

CSS剪裁区可以实现很多有趣的效果，比如剪裁出一个心形、星形等等。同时，它也是响应式布局中非常实用的技术，可以用于处理不同尺寸屏幕下的布局问题。