程序员经验分享-hwhale

如何为网站添加浏览器选项卡图标（favicon）？

2023-12-26

我一直在开发一个网站，我想在浏览器选项卡中添加一个小图标。

我如何在 HTML 中执行此操作以及我需要将其放置在代码中的何处（例如标头）？我有一个.png我想将其转换为图标的徽标文件。

有关的：HTML 在浏览器选项卡上设置图像 https://stackoverflow.com/questions/2359866/html-set-image-on-browser-tab.


实际上有两种方法可以将网站图标添加到网站。

<link rel="icon">

只需将以下代码添加到<head>元素：

<link rel="icon" href="http://example.com/favicon.png">

PNG 图标大多数浏览器都支持，IE 。为了向后兼容，您可以使用 ICO 图标。 http://caniuse.com/#feat=link-icon-png

请注意，您不必先于icon in rel属性与shortcut不再了。从MDN 链接类型 https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types:

The shortcut以前经常看到的链接类型icon，但此链接类型不符合要求，被忽略网络作者不得再使用它.

favicon.ico在根目录下

From 另一个SO答案 https://stackoverflow.com/a/1344379/3853934 (by @墨卡托 https://stackoverflow.com/users/23263/mercator):

所有现代浏览器（使用 Chrome 4、Firefox 3.5、IE8、Opera 10 和 Safari 4 进行测试）将始终请求favicon.ico除非您通过指定了快捷方式图标<link>.

所以你所要做的就是使/favicon.ico请求您的网站返回您的网站图标。遗憾的是，此选项不允许您使用 PNG 图标。

也可以看看favicon.png 与 favicon.ico - 为什么我应该使用 PNG 而不是 ICO？ https://stackoverflow.com/q/1344122/3853934

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

html

icons

favicon

如何为网站添加浏览器选项卡图标（favicon）？ 的相关文章

  • ExitFullScreen 不起作用 + 无论如何要按键盘单击按钮？

    我的浏览器 Google Chrome 版本 33 0 1750 154 m Script function exitFullscreen var element document documentElement if element mo

  • JTree 节点不会被直观地选择

    不知何故 我无法为我的 JTree 节点启用 选择突出显示 我正在我的项目中使用自定义单元格渲染器 这很可能导致此问题 这是完整的渲染器类代码 protected class ProfessionTreeCellRenderer exten

  • Angular - Safari 无法正确显示 DOM

    我是 Angular 的新手 使用 Angular 4 我尝试通过在关联的组件类文件中设置属性来更新特定元素 但是 除非我尝试强制重新绘制网页 通过调整窗口大小等 否则页面不会更新 我打开检查器 看到 DOM 已更改 但显示与元素检查器中的

  • 如何使用javascript隐藏div

    我想使用 Javascript 隐藏一个 div 下面是我的div div class ui dialog titlebar ui widget header ui corner all ui helper clearfix span cl

  • 从 html 页面和 javascript 调用 java webservice

    我正在尝试从 javascript 调用 java 实现的 Web 服务 使用 NetBeans IDE 我读过很多关于 jQuery 和 AJAX 的内容 但我似乎无法掌握它 假设我的 Web 服务 WSDL 位于 http localh

  • 在 Selenium WebDriver 上如何从 Span 标签获取文本

    在 Selenium Webdriver 上 如何从 span 标记检索文本并打印 我需要提取文本UPS Overnight Free HTML代码如下 div id customSelect 3 class select wrapper

  • 如何使用纯 javascript 获取单击元素的 id？

    div style width 100px height 100px background green class div1 Some text div div style width 100px height 100px backgrou

  • 移动网站“WhatsApp”按钮可将消息发送至特定号码

    可以定制移动网站 以允许用户将 WhatsApp 中预先填写的消息分享给手动选择的联系人 如所给出的here https faq whatsapp com en android 28000012它是使用自定义 URL 方案完成的 一个例子

  • 如何将 em 标签重新设置为粗体而不是斜体

    我想让文本在 em 标记粗体而不是斜体 有没有办法用 CSS 来实现这一点 当然 使用以下 CSS 代码 em font weight bold font style normal em

  • 如何使用 :nth-child() 选择所有子项中的所有其他

    我正在开发一个评论系统 我需要拥有其他所有孩子 div 甚至是第一个孩子的孩子 用 CSS 选择 例如 假设我有这个标记 为了简单起见 省略了不需要的结束标签 div class comment div class comment div

  • UIWebView 如何检测 被点击

    我知道下面的方法可以检测链接元素点击 但我想知道是否UIView可以检测是否img元素被点击 BOOL webView UIWebView webView shouldStartLoadWithRequest NSURLRequest re

  • 如何在浏览器上使用样式组件 CDN 构建？

    索引 html 我从以下位置获取 CDN 文件 我怎样才能访问styled功能 const styled window styled components不起作用 对于版本 5 如docs https styled components c

  • 鼠标移动时画布拖动

    我正在尝试构建一个可以使用鼠标移动拖动的画布 我做了一些我无法理解的错误 因为一开始似乎有效 然后出现了一个增量错误 使画布移动得太快 考虑以下代码 window onload function var canvas document ge

  • 无需重定向的 HTML 页面提交

    有没有什么方法可以在不使用ajax的情况下提交html表单而无需从当前页面重定向 你可以设置一个target 为您form 这样您就可以将表单提交到新选项卡 target blank 或一个小的 隐藏的iframe target nameo

  • 指定 HTML5 输入类型 = 日期的值输出？

    我想将本机日期选择器添加到我的应用程序中 该应用程序当前使用遗留的本地系统 日期输入支持尚未广泛普及 但如果我可以基于兼容性提供这两种实现 那就太理想了 有没有办法指定 HTML 日期选择器给出的值的输出 歌剧的默认设置是yyyy mm d

  • 如何使用 HTML 和 CSS 在我的网站上显示社交图标？

    我拼命尝试向我的网站添加一些图标 但无法让它们正确显示 我想要的只是一个包含图像并在线显示它们的容器 然后我想在该容器和图像之间添加一些填充 仅此而已 看这里我的方法 如果有人可以帮助我并纠正我的代码 使其真正有效 我会非常高兴 在我的 H

  • CSS 过滤器在 Firefox 中不起作用

    我正在尝试 CSS 过滤器 但它在我的 Firefox 15 0 浏览器中不起作用 HTML div class google img src https www google com images srpr logo3w png div

  • CSS以两种颜色显示一个字符[重复]

    这个问题在这里已经有答案了 css中是否可以用两种颜色制作单个字符 我的意思是例如字符 B 上半部分为红色 下半部分为蓝色 h1 font size 72px background webkit linear gradient red 49

  • 如何在 HTML 中将文本设置为粗体？

    我正在尝试使用 HTML 将一些文本加粗 但我很难让它发挥作用 这就是我正在尝试的 Some

  • jQuery：向左滑动和向右滑动

    我见过slideUp and slideDown在 jQuery 中 左右滑动的功能 方式怎么样 您可以使用 jQuery UI 中的附加效果来做到这一点 详情请参阅此处 http docs jquery com UI Effects Sl

随机推荐

  • 将纬度/经度转换为城市名称？ （反向地理定位）

    我正在 Codeigniter PHP jQuery 中创建一个工作委员会 雇主可以在其中输入他们的位置 我们使用 Google 地图 API 来绘制它 虽然这已经产生了很棒的可用性结果 但问题是 当我们尝试向求职者显示这些位置时 他们会感

  • WPF 如何存储语言字典？

    根据https msdn microsoft com en us library system windows controls spellcheck v vs 110 aspx https msdn microsoft com en us

  • Python Pandas 跨列累积和并在另一个新列中获取结果

    我有包含 col1 col10 的数据框 我想计算跨列的累积总和并动态创建新列 即 cum col1 cum col10 我研究了 cumsum 但这给出了最终的累积和 如何在创建新列时实现累积总和 数据框看起来像 id col1 col2

  • imagecreatefrompng 根本不起作用

    我已经用 mime 类型检查了文件 如果是 jpg 或 gif 则可以完美使用 src imagecreatefromjpeg tmpName and src imagecreatefromgif tmpName 但如果图像是png src

  • 重复单词的正则表达式

    我是正则表达式新手 我不太清楚如何编写一个正则表达式来 匹配 任何重复的连续单词 例如 巴黎在the the spring Not 那个那个相关的 你笑什么 是my my正则表达式那么糟糕 是否有一个正则表达式可以匹配上面所有的粗体字符串

  • 使用 Notepad++ 通过 FTP 连接到服务器

    我正在使用 Notepad 6 5 3 版本 来编辑我的文件 我想使用 Notepad 连接到我的服务器 我使用这个方法 打开 Notepad gt 插件 gt NppFTP gt 显示 NppFTP 窗口 在 NppFTP 窗口中 Cli

  • 在 .NET 中将复杂的布尔条件从字符串转换为布尔值

    我需要将复杂的表达式从字符串解析为布尔值 它只能包含 布尔值 真 假 括号 AND OR 操作数 Eg bool Parse true false false false true false 知道如何实现这一目标吗 这是一个狡猾的评估器类

  • Elasticsearch - IndicesClient.put_settings 不起作用

    我正在尝试更新我原来的索引设置 我的初始设置如下所示 client create index movies body settings number of shards 1 number of replicas 0 analysis fil

  • iPhone“书签到主屏幕”会删除 cookie 和会话吗？

    现在我正在开发一个基于网络的应用程序 用户必须首先登录 当我通过 iPhone Safari 打开页面 登录并重新启动 Safari 时 我仍然处于登录状态 Cookie 和会话 ID 仍然设置 但是 当我使用 添加到主屏幕 添加此页面时

  • spring Net 与企业库

    我一直在网上搜索有关网络框架的信息 从现在起我可以在我的项目中使用它来 保留它 我几乎已经做出了决定 但我想要一些关于该方向的参考信息市场正在继续发展 我在谷歌中找不到任何关于哪个是最常用的 哪个最有未来等等的信息 我也一直在阅读其他框架

  • CoreAnimation CALayer 和 CATextLayer 组合

    I am just playing around with CA lately Now I am kind of stuck This is the thing I want to animate 就目前而言 我已经让圆形动画正常工作了 我

  • gradle.buildStarted 未触发

    我无法在我的 gradle 构建中触发 buildStarted 不确定我做错了什么 我有一个像这样的根项目 gradle 文件 版本 1 0 buildscript repositories maven url http repo jfr

  • 如何在极坐标中的多个条件下使用“when”、“then”和“otherwise”？

    我有一个包含三列的数据集 将检查 A 列中的字符串 如果字符串匹配foo or spam 同一行中其他两列的值L and G应该改为XX 为此我尝试了以下方法 df pl DataFrame A foo ham spam egg L A54

  • Netbeans 代码生成问题：如何编辑自动生成的代码？

    好的 由于 GUI 设计器自动生成的代码 这里出现了一个 netbeans 问题 我使用 netbeans UI 设计器设计了一个 GUI 它是为 java 1 6 编译的 完成 UI 后 我意识到我应该为 Java 1 4 而不是 1 6

  • 函数式编程：列表是否只包含唯一项？

    我有一个未排序的列表 想知道其中的所有项目是否都是唯一的 我天真的做法是 val l List 1 2 3 4 3 def isUniqueList l List Int new HashSet l size l size 这是我能想到的最

  • 每 3 个 div 包裹在一个 div 中

    是否可以使用nth child使用选择器包装 3 个 div wrapAll 我似乎无法算出正确的方程式 so div div div div div div div div div div div div div div 变成 div d

  • 在适用于 Android 的 OpenGL ES 2.0 中激活/使用 GL_TEXTURE1

    我正在尝试使用 GL TEXTURE1 纹理单元来绘制一个简单的形状 我知道如何使用标准 GL TEXTURE0 绘制它 但是当更改它时 有些东西不起作用 我认为从下面的代码中 我只需更改以下内容 glActiveTexture GL TE

  • 如何在android中自动启动服务？

    在Android应用程序中 总是扩展Activity 入口是onCreate 所以看来用户必须选择应用程序并单击才能启动它 如果错误 请告诉我 抱歉 那么 如何实现一个无需用户点击启动应用程序而在后台运行的服务呢 使用 IntentRece

  • js-xlsx ：写入 .xlsx 文件时保留单元格样式

    我已手动创建了一个 xlsx 文件 我已向某些行添加了不同的颜色 并且某些单元格具有自定义日期格式 我正在使用 js xlsx npm 模块从 xlsx 文件读取数据 在写回同一 xlsx 文件以更新某些单元格值时 所选颜色和日期格式会丢失

  • 如何为网站添加浏览器选项卡图标（favicon）？

    我一直在开发一个网站 我想在浏览器选项卡中添加一个小图标 我如何在 HTML 中执行此操作以及我需要将其放置在代码中的何处 例如标头 我有一个 png我想将其转换为图标的徽标文件 有关的 HTML 在浏览器选项卡上设置图像 https st

热门标签