将 favicon.ico 放在根目录最省事，浏览器自动请求；需用 .ico 格式、16×16 或 32×32 像素；png/svg 等需用 显式声明并指定 type；多尺寸用 sizes 属性；苹果设备须额外添加 rel="apple-touch-icon"。
favicon.ico 放在根目录最省事
绝大多数浏览器默认会自动请求 /favicon.ico，只要把图标文件命名为这个、放在网站根目录（比如 https://example.com/favicon.ico），不用写任何 HTML 就能生效。适合静态站点或不想改模板的场景。
注意：必须是 .ico 格式，且推荐尺寸为 16×16 或 32×32 像素；现代浏览器虽支持 PNG，但旧版 IE 只认 ICO，放根目录时别用 .png 后缀。
用 <link rel="icon"> 指定任意路径和格式
想用 PNG、SVG 或放在子目录（如 /assets/icon.svg），就得显式声明。关键不是标签本身，而是 rel 和 type 的组合：
-
rel="icon"是基础声明，必须写 - 指定 PNG 时加
type="image/png"，否则部分浏览器可能忽略 - SVG 图标需写
type="image/svg+xml"，且仅 Chromium 和 Firefox 支持（Safari 不支持 SVG favicon） - 可以同时放多个
<link>，浏览器按顺序尝试，取第一个能加载的
示例：
<link rel="icon" href="/assets/favicon-32.png" sizes="32x32" type="image/png"><link rel="icon" href="/assets/favicon.svg" type="image/svg+xml">
多尺寸适配要靠 sizes 属性
移动端、PWA、Windows 钉选等场景需要不同尺寸图标，仅靠一个文件不够。这时不能只依赖 href，得用 sizes 明确标注：
-
sizes="16x16"对应地址栏小图标 -
sizes="32x32"常用于桌面书签 -
sizes="192x192"或512x512是 PWA manifest 推荐尺寸，但单独写在<link>中也能被部分浏览器识别 - 不写
sizes时，浏览器会自行缩放，可能模糊
注意：sizes 只对 rel="icon" 有效，对 rel="apple-touch-icon" 等其他类型无效。
苹果设备要用 rel="apple-touch-icon"
Safari 在 iOS/macOS 上完全忽略标准 <link rel="icon">，必须额外声明：
- 文件建议用 PNG，尺寸至少
180×180（iOS 主屏幕图标要求） - 路径可自定义，但推荐放在根目录并命名为
apple-touch-icon.png - 不要加
type属性，苹果不认 - 如果没声明，用户添加到主屏幕时，Safari 会截屏生成低质图标
示例：
<link rel="apple-touch-icon" href="/apple-touch-icon.png">实际部署时最容易漏的是苹果图标和 SVG 的 MIME 类型声明；另外，修改 favicon 后浏览器缓存极顽固，建议上线前用隐身窗口验证，或临时加版本号如
favicon.png?v=2。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
