在 CSS 中裁剪图像的中心
Clipping the center of an image in CSS
我正在尝试在全屏视频前面放置一个半透明叠加层作为拍照的目标。
我要剪掉的部分在此图像中显示为白色：https://ibb.co/cK6xb8
clip-path 能够剪切图像的外部，但如何剪切内部？
您可以在 clip-path 中使用多边形执行此操作。查看 Clippy 并选择框架选项作为示例。
-webkit-clip-path: polygon(0% 0%, 0% 100%, 25% 100%, 25% 25%, 75% 25%, 75% 75%, 25% 75%, 25% 100%, 100% 100%, 100% 0%);
clip-path: polygon(0% 0%, 0% 100%, 25% 100%, 25% 25%, 75% 25%, 75% 75%, 25% 75%, 25% 100%, 100% 100%, 100% 0%);
我正在尝试在全屏视频前面放置一个半透明叠加层作为拍照的目标。
我要剪掉的部分在此图像中显示为白色：https://ibb.co/cK6xb8
clip-path 能够剪切图像的外部，但如何剪切内部？
您可以在 clip-path 中使用多边形执行此操作。查看 Clippy 并选择框架选项作为示例。
-webkit-clip-path: polygon(0% 0%, 0% 100%, 25% 100%, 25% 25%, 75% 25%, 75% 75%, 25% 75%, 25% 100%, 100% 100%, 100% 0%);
clip-path: polygon(0% 0%, 0% 100%, 25% 100%, 25% 25%, 75% 25%, 75% 75%, 25% 75%, 25% 100%, 100% 100%, 100% 0%);