当前位置: 首页 > news >正文

clip-path实现图片边角的裁剪

img {clip-path: polygon(0 7px,7px 0,calc(100% - 20px) 0,100% 20px,100% 100%,16px 100%,0 calc(100% - 16px));}

每一个逗号隔开的就是路径坐标 左上角的两个点 0 7px ,7px 0
右上角 calc(100% - 20px) 0,100% 20px
相当于通过这些点练成的线的圈起来的部分就是剩下的图片
在这里插入图片描述

http://www.lryc.cn/news/430407.html

相关文章:

  • 【C++ Primer Plus习题】2.7
  • uboot中 fastboot udp 协议分析
  • redis hash类型的命令
  • 【OpenCV】 中使用 Lucas-Kanade 光流进行对象跟踪和路径映射
  • ES 支持乐观锁吗?如何实现的?
  • 前端宝典十一:前端工程化稳定性方案
  • yum 数据源的切换
  • MySQL入门学习-命令行工具.mysqlbinlog
  • WARNING XXX is not overriding the create method in batch
  • 使用预训练的 ONNX 格式的目标检测模型(基于 YOLOv8n-pose)姿态监测
  • matlab实现模拟退火算法
  • 【Prettier】代码格式化工具Prettier的使用和配置介绍
  • 【计算机网络】网络基础
  • MFC在对话框中实现打印和打印预览
  • 移动端页面出现闪屏
  • elasticsearch的高亮查询三种模式查询及可能存在的问题
  • 【精品实战项目】深度学习预测、深度强化学习优化、附源码数据手把手教学
  • JavaScript 手写仿深拷贝
  • spring低版本设置cookie的samesite属性
  • GPT4o编写步进电机控制代码
  • 关于Spring Boot的自动配置
  • ## 已解决:`java.sql.SQLSyntaxErrorException: SQL语法错误` 异常的正确解决方法,亲测有效!!! ###
  • 备战秋招60天算法挑战,Day22
  • 在Linux下搭建go环境
  • 738.单调递增的数字
  • 近年国际重大网络安全事件深度剖析:安全之路任重道远
  • Windows C++控制台菜单库开发与源码展示
  • ARM——驱动——Linux启动流程和Linux启动
  • Docker和虚拟机的区别详细讲解
  • leetcode_68. 文本左右对齐