clip-path
利用 CSS 的 clip-path 属性快速画三角形、气泡框
clip-path 结合 polygon 函数,可以快速切出一个三角形、气泡框。 a. 三角形有三个顶点,因此 polygon 需要传三个参数,每个参数是顶点的 x 和 y 轴位置百分比: #triangle-1 { -webkit-clip-path: polygon(50% 0, 100% 10 ......
使用clip-path将 GIF 绘制成跳动的字母
## 前言 之前看到过一个有趣的CSS效果,今天我们也来实现一遍,将动图GIF通过`clip-path`绘制成一个个跳动的字母。 效果如下: ![](https://img2023.cnblogs.com/blog/1525717/202307/1525717-20230720101719914-1 ......
CSS3 clip-path:打造独特创意设计效果的秘密武器
通过借助 clip-path 这一 css3 属性,通过各种三角拼接出任意形状。由阿姆斯特丹设计师Bryan James通过30张CSS碎片拼图展现30种濒临灭绝动物的... ......
clip-path 剪切不规则路径后,阴影不生效问题
正常来说:我们使用box-shadow都是能够生效的,但由于使用了clip剪切功能,使用阴影被剪切了所以我们在使用clip的时候只需要超出path就行了,比如: height: 50px; width: 100px; background: antiquewhite; clip-path: poly ......