<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
<!-- 创建一个圆形并应用径向渐变 -->
<circle cx="100" cy="100" r="75" fill="url(#radialGradient)" />
<!-- 定义径向渐变 -->
<radialGradient id="radialGradient" cx="50%" cy="50%" r="50%" fx="50%" fy="50%">
<stop offset="0%" style="stop-color:#3498db; stop-opacity:1" />
<stop offset="100%" style="stop-color:#e74c3c; stop-opacity:1" />
</radialGradient>
</svg>
在上面的示例中，我们创建了一个圆形，并通过fill属性使用了名为"radialGradient"的径向渐变。径向渐变通过<radialGradient>元素定义，其中id属性为渐变定义一个唯一的标识符，而cx, cy, r属性则分别确定了渐变的中心点和半径，fx和fy属性分别指定了焦点的位置。
在<radialGradient>元素内部，我们同样使用了两个<stop>元素定义了渐变的起始颜色和结束颜色，通过offset属性来确定颜色的位置。在这个例子中，起始颜色是蓝色(#3498db)，结束颜色是红色(#e74c3c)。
你可以根据需要调整圆形的位置、半径、渐变的中心点和半径，以及颜色的位置和数量来满足你的设计需求。
转载请注明出处：http://www.pingtaimeng.com/article/detail/14681/SVG