如何使用HTML将Favicon添加到您的网站

在本教程中，我们将介绍使用 HTML 将网站图标添加到您的网页所涉及的步骤。 您可以为您的网站图标使用您喜欢的任何图像，但请记住，鉴于网站图标的小尺寸，简单、高对比度的图像通常效果最佳。 您还可以通过 favicon.cc 等网站生成自定义网站图标。

网站图标是位于网页标题左侧的浏览器选项卡中的小图像。 下图说明了网站图标的位置。

要将网站图标添加到您的站点，请在您的项目目录中创建一个名为 images 的文件夹（如果您还没有）并将所需的网站图标图像保存在此文件夹中。 如果您没有图像，请下载我们在演示网站上托管的此 Sammy the Shark 图像。 （有关如何使用 HTML 将图像添加到网页的复习，请访问本教程系列前面的教程 HTML 图像。

接下来，将 <link> 元素（下面突出显示）添加到 <title> 元素正下方的 index.html 文件中。 您的代码现在应该是这样的：

...
<title> Sammy’s First Website </title>
<link rel="shortcut icon" type="image/jpg" href="Favicon_Image_Location"/>
...

确保将 Favicon_Image_Location 替换为您的网站图标图像的相对文件路径。 保存 index.html 文件并在您的网络浏览器中重新加载它。 您的浏览器选项卡现在应该包含一个网站图标图像。

您现在应该知道如何使用 HTML 将网站图标图像添加到网站。