fill 和 stroke 是 SVG 原生颜色属性，优先级高于 CSS；内联 SVG 才能用 CSS 类控制，需清除内联属性并写全路径选择器；currentColor 可使颜色随父元素文字色动态变化。
直接用 fill 和 stroke 控制 SVG 颜色最可靠
SVG 本身不是图片，而是可编程的矢量标记语言，fill 和 stroke 是它的原生属性，优先级高于 CSS 的 color 或 background-color。如果你发现 CSS 设置没生效，大概率是 SVG 元素自带了内联 fill/stroke，或者被更具体的样式覆盖了。
-
fill控制图形内部填充色（如 -
stroke控制描边颜色（需同时设stroke-width才可见） - 对
fill相当于文字颜色，stroke可加文字描边 - 支持所有 CSS 颜色值：
#fff、rgb(255,0,0)、var(--primary)、甚至url(#gradient)
内联 SVG 中用 CSS 类控制 fill 和 stroke
把 SVG 写在 HTML 里（即内联 SVG），才能用 CSS 类精准控制。外部 SVG 文件或 
- 必须去掉 SVG 标签里的内联
fill/stroke属性，否则会覆盖 CSS - CSS 选择器要写全路径，比如
.icon path、.icon circle，不能只写.icon - 若 SVG 含
引用符号（
.icon path {
fill: currentColor;
}
.icon circle {
stroke: #333;
stroke-width: 2;
}
用 currentColor 让 SVG 颜色跟随文字色
这是最灵活的做法：把 SVG 的 fill 或 stroke 设为 currentColor，它会自动取父元素的 color 值。按钮、图标按钮、导航项都适合这样写。
- 适用于内联 SVG，不适用于
- 如果父元素没设
color，会回退到浏览器默认（通常是黑色） - 可配合伪类使用：
.btn:hover svg { color: #007bff; }，再让 SVG 内部用currentColor - 注意：某些 SVG 导出工具（如 Figma 导出）默认给每个
path加了fill="#000"，得手动删掉
fill 和 stroke 在不同 SVG 使用方式下的限制
不是所有 SVG 加载方式都支持 CSS 控制颜色。搞错加载方式，再写对 CSS 也没用。
立即学习“前端免费学习笔记（深入）”；
-
-
background-image: url(logo.svg)：同上，且 SVG 中不能含外部引用或 JS -
：理论上可访问 DOM，但跨域、缓存、兼容性差，不推荐 - 内联 SVG（
直接写在 HTML 中）：唯一稳定可控的方式
