“HTML网站图标Favicon”的版本间差异
本页内容
（创建页面，内容为“22 网站图标是显示在浏览器选项卡中页面标题旁边的小图像。 == 如何在 HTML 中添加 Favicon == 您可以使用任何您喜欢的图像作为您的网站图标。 您还可以在 https://favicon.io/ 或者 https://www.favicon.cc 等网站上创建自己的网站图标。 提示：网站图标是一个小图像，因此它应该是一个具有高对比度的简单图像。可以是网站的logo，或者网站…”） |
|||
| 第16行： | 第16行： | ||
接下来，''' <nowiki><link></nowiki> '''在“index.html”文件中添加一个元素，在''' <nowiki><title></nowiki> '''元素之后，如下所示： | 接下来，''' <nowiki><link></nowiki> '''在“index.html”文件中添加一个元素，在''' <nowiki><title></nowiki> '''元素之后，如下所示： | ||
<sample title=" | <sample title="" desc="" > | ||
<!DOCTYPE html> | <!DOCTYPE html> | ||
<html> | <html> | ||
2022年8月4日 (四) 21:56的最新版本
网站图标是显示在浏览器选项卡中页面标题旁边的小图像。
如何在 HTML 中添加 Favicon
您可以使用任何您喜欢的图像作为您的网站图标。 您还可以在 https://favicon.io/ 或者 https://www.favicon.cc 等网站上创建自己的网站图标。
提示：网站图标是一个小图像，因此它应该是一个具有高对比度的简单图像。可以是网站的logo，或者网站名字中的一个字。
favicon 图像显示在浏览器选项卡中页面标题的左侧，当打开多个tab的时候可以很快的让用户定位网站，如下所示：
要将网站图标添加到您的网站，请将您的网站图标图像保存到网络服务器的根目录，或者在根目录中创建一个名为 images 的文件夹，并将您的网站图标图像保存在此文件夹中。网站图标图像的通用名称是“favicon.ico”。
接下来， <link> 在“index.html”文件中添加一个元素，在 <title> 元素之后，如下所示：
示例
<!DOCTYPE html>
<html>
<head>
<title>My Page Title</title>
<link rel="icon" type="image/x-icon" href="http://www.xiaobai.wang/favicon.ico">
</head>
<body>
<h1>小白教程</h1><p>www.xiaobai.wang</p>
</body>
</html>现在，保存“index.html”文件并在浏览器中重新加载它。您的浏览器选项卡现在应该在页面标题的左侧显示您的网站图标图像。