SVG阴影和模糊必须用原生实现：外阴影用feOffset+feGaussianBlur+feMerge三步组合；内阴影需通过SourceAlpha蒙版反转后合成；纯模糊直接用feGaussianBlur。
SVG 图形不能直接用 CSS 的 box-shadow 或 filter: blur() 实现阴影和模糊，必须通过 SVG 原生的 <filter></filter> 元素定义滤镜，再用 filter 属性引用。核心是组合 <feoffset></feoffset>、<fegaussianblur></fegaussianblur>、<femerge></femerge> 等滤镜原语，且需注意坐标范围设置，否则效果会被裁剪。
添加投影阴影（外阴影）
最常用、兼容性最好的写法是三步组合：偏移 → 模糊 → 合并。适用于所有现代浏览器（包括 Firefox 和旧版 Safari）：
- 在
<defs></defs>中定义<filter></filter>，设好x、y、width、height（建议至少"-50%"到"200%"，防止阴影被截断） - 用
<feoffset></feoffset>移动图形副本生成阴影位置，dx/dy控制方向和距离 - 用
<fegaussianblur></fegaussianblur>对偏移层模糊，stdDeviation越大越柔和 - 用
<femerge></femerge>把模糊阴影和原始图形叠在一起；其中<femergenode in="offsetBlur"></femergenode>放前面，<femergenode in="SourceGraphic"></femergenode>放后面
示例代码：
然后给目标图形加上：filter="url(#drop-shadow)"
添加内阴影（inset shadow）
内阴影不是简单反向偏移，而是利用图形 Alpha 通道做蒙版，再模糊后“扣”进内部。关键步骤是反转透明度 + 合成限制：
Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转
下载
实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
- 以
in="SourceAlpha"起始，得到图形轮廓的黑白蒙版（黑=透明，白=不透明） - 用
<fecomposite></fecomposite>的operator="arithmetic"或"in"反转蒙版（让内部变可操作区域） - 对反转后的蒙版做
<fegaussianblur></fegaussianblur>和<feoffset></feoffset>（可选），生成阴影形状 - 用
<fecomposite operator="in"></fecomposite>将阴影限制在原始图形范围内 - 最后用
<femerge></femerge>把处理后的阴影与SourceGraphic叠加
简明写法（省略部分 result 命名，适合快速实现）：
单独添加高斯模糊
如果只要模糊，不用阴影，最简方式是直接使用 <fegaussianblur></fegaussianblur>：
- 把
in设为"SourceGraphic"，表示对整个图形模糊 -
stdDeviation控制强度；支持两个值如"2 5"实现横向/纵向不同模糊度 - 注意仍要扩大
<filter></filter>的width/height，否则边缘会硬切
例如：<fegaussianblur in="SourceGraphic" stddeviation="6"></fegaussianblur>，搭配 filter="url(#blur)" 即可生效。
兼容性与避坑提醒
<fedropshadow></fedropshadow> 虽简洁，但 Firefox 完全不支持，Safari 需 v16.4+ 且开启实验功能，生产环境慎用。务必坚持三步组合写法。
-
滤镜区域必须足够大：默认
width="100%" height="100%"会裁掉模糊扩散部分，推荐统一设为width="200%" height="200%"并配x="-50%" y="-50%" -
不要漏掉
<defs></defs>容器：所有<filter></filter>必须放在<svg></svg>内的<defs></defs>中才可复用 -
避免在 HTML 外联 SVG 中重复定义：多个 SVG 共用同一滤镜时，可将
<defs></defs>提到页面顶部的隐藏 SVG 中（position: absolute; width: 0; height: 0）
