网站图标 HTML介绍

网站图标，也叫做站点图标、网站标志，是指显示在浏览器标签页和收藏夹上的小图标。HTML中，我们使用link元素来指定网站图标。

HTML link元素

link元素通常用来指定不同资源之间的关系，例如：

• 设定样式表的关系
• 规定网站图标的关系
• 规定与文档相对应的桌面上的图标

最常见的用途是规定网站图标的关系。我们可以使用link元素的rel属性指定图标与网站的关系，用type属性指定文件类型，用href属性指定图标的路径。例如：

<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">

这个例子中，rel属性的值为shortcut icon，指定了网站图标与网站的关系；type属性的值为image/x-icon，指定了图标的文件类型；href属性的值为favicon.ico，指定了图标文件的路径。

图标文件类型

在上面的例子中，我们指定了图标文件类型为image/x-icon。实际上还可以指定其他的文件类型，例如：

• image/vnd.microsoft.icon: IE浏览器专用的ICO文件格式
• image/png: PNG格式
• image/gif: GIF格式

其他属性

除了上面介绍的3个属性外，link元素还有其他一些属性可以用来指定图标，例如：

• sizes: 指定图标的尺寸，例如sizes="32x32 16x16"
• media: 指定显示该图标的设备类型，例如media="screen"
• title: 指定图标的名称，例如title="My Website"

总结

在HTML中指定网站图标的方法很简单，只需要使用link元素，指定rel属性为shortcut icon，type属性为图标的文件类型，href属性为图标的路径即可。同时，我们还可以使用其他属性来进一步指定图标。