技术栈

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
相关推荐
wwy_frontend
8 分钟前
useState 的 9个常见坑与最佳实践
前端·react.js
w_y_fan
9 分钟前
flutter_riverpod: ^2.6.1 应用笔记 (一)
前端·flutter
Jerry
11 分钟前
Compose 界面工具包
前端
Focusbe
12 分钟前
从0到1开发一个AI助手
前端·人工智能·面试
egghead26316
12 分钟前
React组件通信
前端·react.js
RIKA
13 分钟前
【前端工具】使用 Node.js 脚本实现项目打包后自动压缩
前端
橙某人
19 分钟前
🖼️照片展示新境界!等高不等宽自适应布局完整教程⚡⚡⚡
前端·javascript·css
咕噜分发企业签名APP加固彭于晏
22 分钟前
市面上有多少智能体平台
前端·后端
尝尝你的优乐美
23 分钟前
man!在console中随心所欲的打印图片和字符画
前端·javascript·vue.js
一个专注api接口开发的小白
1 小时前
Python/Node.js 调用taobao API:构建实时商品详情数据采集服务
前端·数据挖掘·api
热门推荐
01UV安装并设置国内源022025最新国内服务器可用docker源仓库地址大全(2025年8月更新)03全球最强模型Grok4,国内已可免费使用!(附教程)04Qwen3-Coder 快速上手教程 | Qwen Code + Claude Code05TRAE Rules 实践:为项目配置 6A 工作流06KGG转MP3工具|非KGM文件|解密音频07[已解决]VSCode右键菜单消失恢复08GPT-5 使用限制与国内升级全攻略(免费 / Plus / Pro)【2025 最新】09Cursor 终端“卡死/无响应”问题的解法10OpenAI重返开源!GPT-OSS本地部署完全指南