css clip怎么用,每天一个小技巧：CSS clip-path 的妙用

CSS 的 clip-path 属性是 clip 属性的升级版，它们的作用都是对元素进行 “剪裁”，不同的是 clip 只能作用于 position 为 absolute 和 fixed 的元素且剪裁区域只能是正方形，而 clip-path 更加强大，可以以任意形状去裁剪元素，且对元素的定位方式没有要求。基于这样的特性，clip-path 常用于实现一些炫酷的动画效果。

比如：

视差广告效果：

菜单栏弹出效果：

Clip Path分类

clip-path 有几大类，分别为：

basic-shape: 基本图形，包括 inset()、circle()、ellipse()、polygon()

clip-source: 通过 url() 方法引用一段 SVG 的 来作为剪裁路径