本文介绍了SVG中的阴影效果和渐变类型，包括如何使用<filter>定义阴影，通过feBlend和feGaussianBlur实现不同模式的阴影效果。此外，还详细讲解了线性渐变和径向渐变的创建，以及它们的各种用法，如设置stop-color和stop-opacity等属性来调整颜色和不透明度。
（阴影
<defs> 元素是定义的缩写，包含特殊元素（例如滤镜）的定义。
<filter> 元素用于定义 SVG 滤镜。
<filter> 元素具有必需的 id 属性，用于标识滤镜。 图形然后指向要使用的滤镜。
feOffset 整个阴影的偏移
feBlend 元素用于将两个图像或SVG片段组合为单个图形
运行效果:
mode值可以更改为:
normal——正常
multiply——正片叠底
screen——滤色
darken——变暗
lighten——变亮
feGaussianBlur 元素是用于创建模糊效果
运行效果：
线性渐变
linearGradient 元素用于定义线性渐变。
stop-color:它指示在停止点使用的颜色
stop-opacity：他告诉在停止点使用的Alpha值或不透明度。预设值为1。
运行效果：
线性渐变可以定义为水平，垂直或角渐变：
- 当y1和y2相等，而x1和x2不同时，可创建水平渐变
- 当x1和x2相等，而y1和y2不同时，可创建垂直渐变
- 当x1和x2不同，且y1和y2不同时，可创建角形渐变
径向渐变
radialGradient 元素用来定义一个径向渐变，和前面一样，它也必须包含在 <defs> 定义标签中。
运行效果:
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
