SVG currentColor 在 GitHub README 中不起作用？答案

【问题标题】：SVG currentColor not working in GitHub README?SVG currentColor 在 GitHub README 中不起作用？
【发布时间】：2021-07-18 23:34:00
【问题描述】：

我正在尝试使 SVG 颜色与 GitHub 自述文件中周围文本的颜色相匹配。（如果将文本设置为"fill=black"，则在 GitHub 的深色模式下几乎看不到。）

来自here，我收集到我可以使用

fill="currentColor"

获取最近（周围）CSS 元素的color 属性。我尝试了一个显示简单圆圈的 SVG：

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" baseProfile="full" viewBox="-500 -500 1000 1000">
  <circle r="400" fill="currentColor" />
</svg>

SVG 嵌入在自述文件中

<p align="center">
  <img src="https://nschloe.github.io/smoothfit/disk.svg" width="60%">
</p>

但是，填充颜色将始终显示为黑色。

（来自here）。

知道出了什么问题吗？

【问题讨论】：

寻求代码帮助的问题必须包括在问题本身中重现它所需的最短代码，最好是在堆栈片段中。尽管您已经提供了一个链接，但如果它变得无效，那么您的问题对于未来遇到同样问题的其他 SO 用户将毫无价值。见Something in my website/example doesn't work can I just paste a link。
感谢@Paulie_D 的提示。我添加了 SVG 的代码。不过，我不确定如何在一小段代码中捕获它的 GitHub 方面。如果有建议，请告诉我！
我不相信使用 <img> 元素是可能的，你需要使用 <svg>，我不确定 GitHub markdown 是否支持。

标签： css github svg

【解决方案1】：

@Alicia 的重播是正确的解释：要使currentColor 工作，SVG 需要嵌入到 HTML 中。如果它作为img 标签包含，则它不起作用。这个

<!DOCTYPE html>
<html>
<body>
  Lorem ipsum
  <p style="color:red">
  <svg xmlns="http://www.w3.org/2000/svg" version="1.1">
    <circle r="100" fill="currentColor" />
  </svg>
  </p>

  dolor sit amet
  <p style="color:red">
    <img src="https://nschloe.github.io/smoothfit/disk.svg" width="100px"/>
  </p>
</body>
</html>

给予

【讨论】：