技术栈

css3 clip-path剪切图片

百事可乐☆2023-12-15 13:45

大致看了一下,反正以后用到就慢慢调吧

剪切四个角

clip-path: polygon(14px 0, calc(100% - 14px) 0,

100% 14px, 100% calc(100% - 14px),

calc(100% - 14px) 100%, 14px 100%,

0 calc(100% - 14px), 0 14px);

三角形

clip-path: polygon(50% 0,0 100%, 100% 100%);

矩行

clip-path:inset(10px)

括号内的值类似于margin、padding值的写法,可以写一个值,也可以写多个值。

上一篇:双端队列和优先级队列
下一篇:vm的centos本地配置yum
相关推荐
子兮曰
3 小时前
OpenClaw入门:从零开始搭建你的私有化AI助手
前端·架构·github
吴仰晖
3 小时前
使用github copliot chat的源码学习之Chromium Compositor
前端
1024小神
3 小时前
github发布pages的几种状态记录
前端
不像程序员的程序媛
5 小时前
Nginx日志切分
服务器·前端·nginx
Daniel李华
5 小时前
echarts使用案例
android·javascript·echarts
北原_春希
5 小时前
如何在Vue3项目中引入并使用Echarts图表
前端·javascript·echarts
JY-HPS
5 小时前
echarts天气折线图
javascript·vue.js·echarts
尽意啊
5 小时前
echarts树图动态添加子节点
前端·javascript·echarts
吃面必吃蒜
5 小时前
echarts 极坐标柱状图 如何定义柱子颜色
前端·javascript·echarts
O_oStayPositive
5 小时前
Vue3使用ECharts
前端·javascript·echarts
热门推荐
01GitHub 镜像站点02Claude Code + GLM4.7 避坑指南:解决 Unable to connect to Anthropic services03OpenClaw Chrome扩展使用教程 - 浏览器中继控制04Linux下V2Ray安装配置指南05使用 1panel面板 部署 php网站06UV安装并设置国内源07从零搭建一个 PHP 登录注册系统(含完整源码)08openclaw配置教程(linux+局域网ollama)09Vue-skills的中文文档10Claude Code Skills 实用使用手册