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

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

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

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

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

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

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