currentColor没反应是因为SVG未处于有效color继承链，需确保父容器有明确color值、清除内联stroke属性、CSS规则作用于path/circle等子元素而非svg标签。
为什么stroke: currentColor有时没反应
不是语法错，而是 SVG 没处在有效的 color 继承链上。currentColor 取的是当前元素自身计算出的 color 值，不是“从父级传下来”的。如果父容器是 <button></button>，浏览器 UA 样式可能让它的 color 是 buttontext（Chrome）或未定义值，导致子 <svg></svg> 计算出的 color 是黑色或 inherit。检查开发者工具「Computed」面板里 <svg></svg> 的 color 值，要是 rgb(0, 0, 0) 或 inherit，说明继承断了。
必须删掉所有硬编码 stroke 属性
导出工具（Figma/Illustrator）常自动加 stroke="black"、stroke="#333" 或 style="stroke: red" —— 这些内联属性优先级高于 CSS，会静默覆盖 stroke: currentColor。必须手动清理：
- 删掉所有
stroke="xxx"，包括<path stroke="..."></path>、<circle stroke="..."></circle> - 删掉所有
stroke-width="..."如果你打算用 CSS 控制粗细（否则保留也行） - 确保
<svg></svg>标签上没有style="stroke: ..." - 保留
viewBox、d、width、height等非颜色属性
写法要落在子元素上，不是 <svg></svg> 根标签
<svg></svg> 标签本身不响应 stroke，它只是容器。CSS 规则必须匹配到图形元素：
- ✅ 正确：
svg path { stroke: currentColor; }、svg circle { stroke: currentColor; } - ❌ 错误：
svg { stroke: currentColor; }—— 完全无效 - 如果图标含描边+填充，别忘了同时设
fill: currentColor，否则只变描边色 - Tailwind 用户可直接用
stroke-current类（v3.3+），等价于stroke: currentColor
伪类或深色模式下容易漏的关键点
hover 或 dark mode 失效，往往是因为触发对象没设 color：
立即学习“前端免费学习笔记（深入）”；
-
.btn:hover { color: #28a745; }能生效，但前提是<svg></svg>在<button></button>内部，且按钮本身有可计算的color - 深色模式下，若父容器用的是静态 class 如
text-gray-700，它不会随@media (prefers-color-scheme: dark)切换，图标也就不会变 - 正确写法：
class="text-gray-900 dark:text-gray-100"，或用 CSS 变量：color: var(--text-color); - IE11 和 Safari ≤15.4 不支持
background-color: currentColor，但stroke支持度好得多（Edge 12+、Chrome 26+、Firefox 19+）
color: inherit;，也比什么都不写强——currentColor 需要一个明确的、可计算的起点，而不是靠浏览器默认回退。 
