使用字体超赞图标作为标志

是否可以使用 超赞字体图标作为收藏夹图标?就是浏览器标签上网站标题旁边的那个小图标?

71075 次浏览

方法1

  1. 只要访问 丰塔瓦斯美术馆
  2. 现在搜索并打开所需的图标,即 编辑图标
  3. 单击下载 svg,如给定图像所示。

enter image description here

  1. 现在您可以在您的网站中使用这个 svg 文件作为图标,请参阅 如何设置图标

方法2

截取你想要的角色的截图,剪下你想要的部分,并将其保存为图像(。伊科)。

现在,您可能需要检查每个浏览器支持的格式: http://en.wikipedia.org/wiki/Favicon#File_format_support

如果你的字符是图像或矢量文件,你会好与大多数浏览器,但 IE (因为 MS 讨厌你)。否则,你必须先将它们保存为图像。

任何图像都可以上传到图标生成器网站,如

Http://favicon-generator.org/

或者

Http://www.favicon.cc/

按照您选择的网站上的在线说明进行操作。通常只有三个步骤。将图标保存在网站的顶层。

为了兼容不同浏览器,我建议总是使用图片作为图标。即使您创建的一些网站只是为现代浏览器仍然转换您的图标艺术品的图像。持续使用相同的过程可以让您少一件需要担心的事情。

这是不可能的,你可以使用直接可怕的字体字符作为图标而不转换成图像。你必须把字符转换成图像。.

编辑: 我建议您使用 http://gauger.io/fonticon


我已经创建了一个在线字体了不起的收藏夹生成器这样做!

参见 字体超赞的图标生成器

我还创建了一个在线 字体超赞的图标生成器,它具有保罗 · 费雷特的解决方案中缺少的额外功能。

favicon

  • 浏览器中的图标预览
  • 图标的大小
  • 透明的图标和背景
  • 巨大的图像尺寸(图标可以是你想要的详细信息)
  • 图标集可以通过 github pull 请求更新
  • 更新06/2017 更新至 Font Awesome 4.7
  • 更新06/2017 模糊搜索和关键字搜索
  • 更新09/2017 堆叠图标
  • 更新06/2018 更新到 Font Awesome 5.0.13
  • 更新11/2018 更新到 Font Awesome 5.5.0
  • 更新04/2019 更新到 Font Awesome 5.8.1
  • 更新11/2021 更新到 Font Awesome 5.15.4

如果你想要额外的功能,请随时提交一个问题或拉请求 给你

Font Awesome 托管在许多流行的 CDN 上,使您能够直接链接到各个 SVG 文件。只需将 <link>元素的 href URL 设置为宿主 超赞字体库中所需的 SVG 即可。

JsDelivr上托管的“火箭”书签图标的 HTML 示例:

<head>
<link rel=icon href=https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.15/svgs/solid/rocket.svg>
</head>

铬合金中看起来是什么样子:
screenshot

这种方法的一个局限性是,大多数浏览器不支持更改颜色或修改任何样式属性。

如果使用 mask-icon关系和 color属性,Safari 支持自定义颜色。如果用户选择了 “在选项卡中显示网站图标”选项,彩色书签图标将显示在 Safari 的固定选项卡和常规选项卡上。

彩色书签图标的 HTML 示例:

<head>
<link rel=mask-icon color=teal
href=https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.15/svgs/solid/rocket.svg>
</head>

旅行中看起来是什么样子:
screenshot

乘坐火箭:
Https://centerkey.com/files/rocket.html