gpt4 book ai didi

html - 带剪辑路径的三 Angular 形 ||多余 "clipping"的背景?

转载 作者:行者123 更新时间:2023-11-28 06:03:43 41 4
gpt4 key购买 nike

我已经为 SVG 和剪辑路径苦苦挣扎了一段时间。

我正在尝试创建一个三 Angular 形剪辑路径,它将覆盖照片以给顶部一个“三 Angular 形”边缘。

photo

我试图实现与照片完全相同的效果,但三 Angular 形“倒转”了。想象一下照片顶部而不是底部的相同三 Angular 形。

我将如何实现这一目标?我能够使用填充颜色创建三 Angular 形本身,但它仍会在三 Angular 形“上方”显示图像。

在网上找到的,它完全符合我的要求,但方法不对。

<svg class="bigTriangleColor2" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="3 0 97 102" preserveAspectRatio="none">
<path fill="rgba(255,255,255,1)" d="M0 0 L51 102 L0 103 Z M0 205 L100 103 L100 2 Z"></path>
</svg>

最佳答案

尝试使用 SVG 编辑器,例如“Inkskape”(免费);然后:

  • 拖放您的图像,根据需要剪辑和 mask ,然后
  • 另存为“普通 SVG”
  • 在您最喜欢的文本编辑器中打开保存的 SVG 文件并删除多余的代码,例如顶部的“XML”声明和任何其他额外内容。
  • 将代码复制并粘贴到任何你想要的地方

快速、简单、容易;)

关于html - 带剪辑路径的三 Angular 形 ||多余 "clipping"的背景?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36586150/

41 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com