如何在Quarto文件的导航栏中插入SVG图像（图标）？

Question

我尝试使用 Quarto 在导航栏中显示 SVG 图标，但在使其工作时遇到问题。我当前在 _quarto.yml 文件中的代码如下：

navbar:
...
right:
  - icon: github
    href: https://github.com/
  - icon: linkedin
    href: https://linkedin.com/
  - icon: static/img/flag-usa.svg
    href: content/experience/index.qmd

但是，SVG 图标未按预期显示。是否有使用 Quarto 将 SVG 图像插入导航栏的正确方法？怎么了？

我感谢任何解决此问题的指导或建议。预先感谢您！

Answer 1

要使用 Quarto 在导航栏中显示 SVG 图标，您需要在文本选项中使用 Markdown 语法而不是图标。

navbar:
...
right:
  - icon: github
    href: https://github.com/
  - icon: linkedin
    href: https://linkedin.com/
  - text: "![](static/img/flag-usa.svg)"
    href: content/experience/index.qmd