HTML 网站图标
网站图标是显示在浏览器选项卡中页面标题旁边的小图像。
可以使用任何您喜欢的图像作为网站图标。您还可以在 https://www.favicon.cc 等网站上创建自己的网站图标。
提示：网站图标是一张小图像，因此它应该是一张具有高对比度的简单图像。
网站图标图像显示在浏览器选项卡中页面标题的左侧，如下所示：
要将网站图标添加到您的网站，请将您的网站图标图像保存到 Web 服务器的根目录中，或者在根目录中创建一个名为 images 的文件夹，并将您的网站图标图像保存在此文件夹中。网站图标图像的常用名称是“favicon.ico”。
接下来，在“index.html”文件中的 <title> 元素后添加一个 <link> 元素，如下所示：
示例
<!DOCTYPE html>
<html>
<head>
<title>我的页面标题</title>
<link rel="icon" type="image/x-icon" href="/images/favicon.ico">
</head>
<body>
<h1>这是一个标题</h1>
<p>这是一个段落。</p>
</body>
</html>
保存“index.html”文件并在浏览器中重新加载。浏览器选项卡现在应该会在页面标题左侧显示 favicon 图像。
图标文件格式支持
下表显示了图标图像的文件格式支持：
| 浏览器 | ICO | PNG | GIF | JPEG | SVG |
|---|---|---|---|---|---|
| Edge | 是 | 是 | 是 | 是 | 是 |
| Chrome | 是 | 是 | 是 | 是 | 是 |
| Firefox | 是 | 是 | 是 | 是 | 是 |
| Opera | 是 | 是 | 是 | 是 | 是 |
| Safari | 是 | 是 | 是 | 是 | 是 |
HTML 页面标题
每个网页都应有一个页面标题来描述页面的含义。
<title> 元素为您的页面添加标题：
示例
<!DOCTYPE html>
<html>
<head>
<title>标题</title>
</head>
<body>
文档内容......
</body>
</html>
标题显示在浏览器的标题栏中：
标题应描述页面的内容和含义。
页面标题对于搜索引擎优化 (SEO) 非常重要。搜索引擎算法会使用该文本来决定在搜索结果中列出页面时的顺序。
<title> 元素：
在浏览器工具栏中定义标题
在将页面添加到收藏夹时提供页面标题
在搜索引擎结果中显示页面标题
因此，请尽量使标题尽可能准确且有意义！
总结
本文介绍了的使用，如有问题欢迎私信和评论
扫一扫
192
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
