【发布时间】：2021-07-24 15:57:38
【问题描述】：
【问题讨论】：
-
点击左边的下载链接可以下载整个包。
-
@Syfer 令人惊讶的是这是最简单的方法
【发布时间】：2021-07-24 15:57:38
【问题描述】：
当 SVG 作为<svg ...></svg> 标记直接集成到 HTML 页面中时。
- 右键单击 SVG 以在开发人员工具中检查它
- 找到
<svg>元素的根并右键单击“复制元素” - 转到https://jakearchibald.github.io/svgomg/ 和“粘贴标记”
- 下载优化后的 SVG 文件并尽情享受
【讨论】：
-
like @lucidbrot cmets 在另一个答案“重要的是要意识到 xmlns="..." 是必需的，即使它不在检查元素页面中”
-
很棒的网站。谢谢！
-
完美运行。
-
如果 SVG 由外部 CSS 设置样式，我认为这不起作用；它仅在样式包含在 SVG 元素中时才有效。
除非我误解了你，否则这就像检查 (F12) 页面上的图标以显示其 .svg 源文件路径一样简单，直接转到该路径 (Example) ，然后用Control+u查看页面源代码。然后保存该代码。
要保存代码，请将其粘贴到文本编辑器（例如 google docs）中。然后将文件另存为 .txt 文件。将该文件名称的末尾从“.txt”更改为“.svg”，现在您的文件为 .svg。此方法不涉及获取任何外部扩展或下载任何程序，并且功能相同。
具体参考该 Salesforce 页面，您可能需要注意他们的图标可在此处免费下载：https://www.lightningdesignsystem.com/icons/！
【讨论】：
-
当然......这更容易哈哈，但不是（似乎是！）OP的问题
-
我有一种奇怪的感觉，他想知道如何下载一个然后他会做剩下的，我可能错了:-)
-
由于某种原因，它与 png 或 jpeg 图像的工作方式不同。直接转到 svg 时我看到空白屏幕，如果在控制台中出现一些错误。
-
@VladyslavKushney 我认为他们正在使用 CSS 为 SVG 着色，这就是它显示为白色的原因。
-
只需将元素保存为 svg 文件
这是一个三步解决方案：
- 复制 SVG 代码 sn-p，并将其粘贴到新的 HTML 页面中。
- 将 HTML 页面保存为（例如）“logo.html”，然后在 Chrome 中点击 > 文件 > 打印 > “另存为 pdf”打开该 HTML 页面
- 现在可以在 Illustrator 中打开此 PDF - 提取矢量 元素。
【讨论】：
-
这是我唯一可以使用的方法。谢谢。您还应该能够按照此处所述使用inkscape：en.wikipedia.org/wiki/Wikipedia:Graphics_Lab/Resources/…
-
非常有帮助。我设法用 Firefox 保存了一个源自 d3.js 并动态操作的图形。但是，pdf 中缺少边缘交互。幸运的是，当打印显示所有节点及其边缘时，它可以在 chrome 中工作。
基于网络搜索，我刚刚找到了一个名为 SVG Export 的 Chrome 插件。
【讨论】：
您可以从网站复制 HTML svg 标签，然后将代码粘贴到新的 html 文件中，并将扩展名重命名为 svg。它对我有用。希望对你有帮助。
【讨论】：
-
这是最好的答案，恕我直言。您不需要任何 3rd-party 应用程序来转换，只需将文件从 .html 重命名为 .svg，您的计算机就会将其视为图像文件。
-
关于如何合并
<svg>标签之外的 CSS 有什么建议吗？
它们都记录在谷歌浏览器开发者工具中的 Elements 下。
<svg><path xmlns="http://www.w3.org/2000/svg" d="M18.6 6.8l-4.3-2.2a.8.8 0 0 0-.6 0l-4 2-4.1-2a.7.7 0 0 0-.7.1.7.7 0 0 0-.3.6v10.8a.7.7 0 0 0 .4.6l4.3 2.1a.8.8 0 0 0 .6 0l4-2 4 2a.6.6 0 0 0 .3.1.7.7 0 0 0 .4-.1.7.7 0 0 0 .4-.6V7.4a.7.7 0 0 0-.4-.6zm-1.1 1.4v5.7a.4.4 0 0 1-.6.4c-1.2-.4-.3-2.3-1.1-3.3-.7-.9-1.7 0-2.6-1.4-.9-1.4.3-2.5 1.4-3a.5.5 0 0 1 .4 0l2.2 1.1a.5.5 0 0 1 .3.5zm-6.1 8.3a.5.5 0 0 1-.5-.1 1.6 1.6 0 0 1-.6-1.1c0-.7-1.2-.4-1.2-1.9 0-1.2-1.3-1.5-2.5-1.3a.5.5 0 0 1-.5-.5V7.2a.4.4 0 0 1 .6-.4l2.6 1.3a.1.1 0 0 1 .1 0l.1.1c1.1.6.8 1.1.4 1.9-.5.9-.7 0-1.4-.3s-1.5.3-1.2.8.9 0 1.4.4.5 1.2 1.9.8 1.7-.3 2.2.2a1.5 1.5 0 0 1 0 2.2c-.4.4-.6 1.3-.8 1.9a.5.5 0 0 1-.2.3z"/></svg>【讨论】：
-
重要的是要意识到
xmlns="..."是必需的，即使它不在检查元素页面中
对我来说，只需在 chrome 服务器中安装以下工具即可：
进入网页后，单击 URL 栏旁边的扩展程序图标，将打开一个新选项卡，显示它在页面上找到的所有 SVG 文件。您可以将 SVG 文件复制到剪贴板，仅下载您需要的少数文件，或单击“下载所有 SVG”按钮将它们全部添加到压缩文件中并下载。
详情查看here
希望对您有所帮助。
【讨论】：
您可以像@mayerdesign 所说的那样从他们的网站下载单个的，或者您可以点击左侧的下载链接下载整个包。
【讨论】：
在 SVG URL 中的 chrome 上，您可以执行 CTRL+S 或 CMD+S，它会自动建议您将页面另存为 .SVG 试试看：https://upload.wikimedia.org/wikipedia/commons/9/90/Benjamin_Franklin-10_Dollar_Bill_Portrait-Vector.svg
【讨论】：
当您访问的页面不允许您通过其自己的 URL 访问 SVG（例如内联 SVG）时，您可以打印该页面并选择 PDF 作为目标输出。保存 PDF 后，您可以在支持矢量的图像编辑器（例如 Adobe Illustrator）中将其打开，仅选择所需的矢量艺术，然后将其剪切并粘贴到图像编辑器中的新文件中。
【讨论】：
我不知道这是否已经被正确回答。好吧。从源下载文件不是解决方案。如何从 URL 中获取 *.svg。
我在 Google Chrome 中安装了“svg-grabber”插件。这只能部分解决我的问题，因为谷歌浏览器没有“返回”一页的快捷方式。
我试图从 URL 下载文件，但一直收到错误消息，当我看到 40 个 svg 文件时，此页面上没有 svg 文件。您可以点击它们，它们会打开，但您无法保存。
WordPress 中的文件夹：.../static/img/icons/
我在 Chrome 中添加了“Go Back With Backspace”插件，因为我必须单独单击每个文件，就好像它们是白色图标（我目前正在寻找）一样，你不会看到它们。您必须单击该文件。然后回来。时间太长了。现在好了。有一个软下载特定的文件夹，但我不想下载一半的互联网，只是得到一个白色的。
当您单击一个白色图标时，会打开一个新选项卡，但它全是白色的。然后你点击 Chrome 中的 svg-grabber 图标，它会在一个黑色背景的新窗口中打开它，并带有一个按钮下载所有 svg。
【讨论】：
我刚刚在另一个网站上尝试过，在 Firefox 中。尝试保存网页后，它给了我一个保存文件为下拉菜单，其中包含一个名为网页的选项，仅限 svg。
【讨论】：
@mayersdesign 解决方案很好但对我来说它不起作用。您只需将 svg 代码保存为 .txt 文件并在任何代码编辑器（如 VS Code / Atom）中打开它，即可将其扩展名重命名为 .svg。尝试在任何浏览器中打开 svg，如果它不起作用，那么只需在 svg 开始标记 <svg xmlns="http://www.w3.org/2000/svg" > 中添加 xmlns，就可以准备好 svg。
【讨论】：
1.检查打开svg的页面。
2.点击以全分辨率显示图像的链接。
3. 执行 CMD/CTRL+S
4.你完成了！
【讨论】：
-
在没有链接的情况下这不起作用。一些 SVG 是使用
<svg>标签创建的。