gpt4 book ai didi

html - 添加颜色和图像以填充 SVG 圆圈

转载 作者:行者123 更新时间:2023-12-05 09:22:11 29 4
gpt4 key购买 nike

我正在寻找一种用纯色和图像填充 SVG 圆圈的方法。

我现在尝试的是使用这段代码:

<svg>
<defs>
<pattern id="visits" height="23" width="14">
<image xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="icons/visit.png" height="23" width="14" x="0" y="0"></image>
</pattern>
</defs>
<circle cx="30" cy="39" r="9" fill="url(#visits)"></circle>
</svg>

它用我的背景图片绘制了一个圆圈,但我也想为我的圆圈添加背景色 - 我该如何实现?

我正在寻找这样的最终结果:http://www.tiikoni.com/tis/view/?id=4ff44d1- 红色背景可以改变,白色十字是图片。

最佳答案

只需在图案中添加红色背景即可。

<svg>
<defs>
<pattern id="visits" height="23" width="14">
<rect height="23" width="14" fill="red"/>
<image xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="icons/visit.png" height="23" width="14" x="0" y="0"></image>
</pattern>
</defs>
<circle cx="30" cy="39" r="9" fill="url(#visits)"></circle>
</svg>

关于html - 添加颜色和图像以填充 SVG 圆圈,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28235501/

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