svg circle设置渐变

来源:3-2 SVG-线性渐变和径向渐变

stickTo

2017-06-22 15:35

svg circle没有径向渐变吗?有的话  如何设置

写回答 关注

1回答

  • 山顶树上
    2017-07-07 16:37:54

    <svg xmlns="http://www.w3.org/2000/svg">

    <defs>

    <radialGradient id="grad3" cx="0.5" cy="0.5" r="0.7" fx="0.5" fy="0.5">

    <stop offset="0" stop-color="rgb(20,151,252)" />

    <stop offset="0.5" stop-color="rgb(164,105,190)" />

    <stop offset="1" stop-color="rgb(255,140,0)" />

    </radialGradient>

    </defs>

    <rect x="100" y="100" fill="url(#grad3)" width="200" height="200" />

    <circle cx="500" cy="200" r="100" fill="url(#grad3)" />

    </svg>


走进SVG

SVG是HTML5 中矢量图的标记语言,学习后掌握更多的干货

52638 学习 · 213 问题

查看课程

相似问题