favicon.ico All In One
favicon.ico All In One
link rel="icon" type="image/x-icon" href="http://example.com/favicon.ico"
https://www.cnblogs.com/xgqfrms/p/9914771.html
<link rel="icon" type="image/x-icon" href="http://example.com/favicon.ico" />
<link rel="icon" type="image/png" href="http://example.com/favicon.png" />
<link rel="icon" type="image/gif" href="http://example.com/favicon.gif" />
<link rel="icon" type="image/jpeg" href="http://example.com/favicon.jpeg" />
<link rel="icon" type="image/webp" href="http://example.com/favicon.webp" />
demo
<link href="x-logo.png" rel="shortcut icon" type="image/png">
vuepress
head: [
['meta', {name: 'theme-color', content: '#3eaf7c'}],
['meta', {name: 'apple-mobile-web-app-capable', content: 'yes'}],
['meta', {name: 'apple-mobile-web-app-status-bar-style', content: 'black'}],
// icon
['link', {href: '../favicon.ico', rel: 'shortcut icon', type: 'image/x-icon'}],
// ['link', {href: '../logo.png', rel: 'shortcut icon', type: 'image/png'}],
// cdn 引入样式
['link', {href: 'https://unpkg.com/element-ui/lib/theme-chalk/index.css', rel: 'stylesheet'}],
// cdn 引入组件库 umd
// ['script', { src: 'https://cdn.jsdelivr.net/npm/react/umd/react.production.min.js' }],
// ['script', { src: 'https://cdn.jsdelivr.net/npm/react-dom/umd/react-dom.production.min.js' }],
['script', {src: 'https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js'}],
['script', {src: 'https://unpkg.com/element-ui/lib/index.js'}],
['script', {src: 'https://cdn.jsdelivr.net/npm/@babel/standalone/babel.min.js'}],
],
服务器 favicon.ico 缓存 bug 和解决方案
solutions
cdn 引入
改变默认 favicon.ico 文件名,如 favicon-logo,
创建 public 文件夹,添加 favicon.ico
description: description,
head: [
['meta', {name: 'theme-color', content: '#3eaf7c'}],
['meta', {name: 'apple-mobile-web-app-capable', content: 'yes'}],
['meta', {name: 'apple-mobile-web-app-status-bar-style', content: 'black'}],
// icon
// ['link', {href: 'http://dap-dev.ads.lilith.sh/favicon.ico', rel: 'shortcut icon', type: 'image/x-icon'}],
['link', {href: '../favicon-logo.ico', rel: 'shortcut icon', type: 'image/x-icon'}],
// ['link', {href: '../favicon.ico', rel: 'shortcut icon', type: 'image/x-icon'}],
// ['link', {href: '../favicon.png', rel: 'shortcut icon', type: 'image/png'}],
// cdn 引入样式
['link', {href: 'https://unpkg.com/element-ui/lib/theme-chalk/index.css', rel: 'stylesheet'}],
// cdn 引入组件库 umd
// ['script', { src: 'https://cdn.jsdelivr.net/npm/react/umd/react.production.min.js' }],
// ['script', { src: 'https://cdn.jsdelivr.net/npm/react-dom/umd/react-dom.production.min.js' }],
['script', {src: 'https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js'}],
['script', {src: 'https://unpkg.com/element-ui/lib/index.js'}],
['script', {src: 'https://cdn.jsdelivr.net/npm/@babel/standalone/babel.min.js'}],
],
refs
https://www.cnblogs.com/xgqfrms/tag/favicon.ico/
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!
原创文章,版权所有️xgqfrms, 禁止转载 ️,侵权必究️!
favicon.ico All In One的更多相关文章
- [转载]网站地址栏小图标favicon.ico的制作方法
有人也许会好奇,有的网址前面有个漂亮的小图标而且有的网站图标还会动,这是怎么做到的呢? 如下图所示: 那个小图标有个名字叫favicon.ico,网站图标虽小但可以起到很好的点缀作用,尤其是当浏览者将 ...
- favicon.ico 404
favicon.ico是一个图标文件.就是浏览网站时显示在地址栏的那个图标. 类似是百度的 显示在网站地址最前面的一张图片 可以在网站根目录(TOMCAT_HOME/webapps/ROOT/favi ...
- favicon.ico 404的问题(title栏前面的图标)
1.页面中自定义图标 去 http://www.bitbug.net/ 定制图片,有32*32,16*16等样式可供选择 2.在页面中引入定义的图片 <link rel="sho ...
- PHP获取网站图标(favicon.ico)文件
有的网站源码中加入了这几行代码: <link rel="shortcut icon" href="/favicon.ico" type="ima ...
- Magento后台简单更换favicon.ico
刚才需要更换网站的favicon.ico,就是浏览器url前面的那个小图标. 网上稍微搜搜一下,然后就震惊了,号多方法是替换文件的方法,而且文件散步在网站的各个角落. 其实,后台是有直接上传更换的方法 ...
- 关于favicon.ico,shortcut icon,icon
引入一篇文章.关于favicon.ico二三事. http://www.cnblogs.com/LoveJenny/archive/2012/05/22/2512683.html 一直对favicon ...
- favicon.ico应用与正则表达式验证邮箱(可自动删除前后的空格)
1.favicon.ico制作:favicon.ico可以ps制作;“shortcut icon”中间有一个空格 <head> <link rel="shortcut ic ...
- 站点图标favicon.ico
favicon.ico图标: 网站的favicon.ico需要一次额外的http请求,无论你是否有在html里面添加 link链接 <link rel="shortcut icon&q ...
- favicon.ico文件简介
本地调试时,控制台经常会打印如下的错误(对 favicon.ico 的请求在 chrome 调试面板下不可见,可在抓包工具,比如 Fiddler 中看到): favicon.ico 是啥?看下面这张图 ...
- 移动端页头推荐配置 出现找不到favicon.ico错误原因和解决方法
favicon 在未指定 favicon 时,大多数浏览器会请求 Web Server 根目录下的 favicon.ico .为了保证 favicon 可访问,避免404,必须遵循以下两种方法之一: ...
随机推荐
- 聊聊.net应用程序的Docker镜像
要在容器中运行.net应用程序,你需要在容器镜像中安装.net Framework或.net Core 运行时.这不是你需要自己管理的东西,因为微软提供的Docker镜像已经安装了运行时,你可以使用 ...
- pycharm2021永久激活
Pycharm破解版地址: 链接: https://pan.baidu.com/s/1dEkzKRFMaeNjWF4h7y2TdQ 提取码: eqr3 Anaconda地址:版本是python3.6 ...
- SpringBoot单元测试的两种形式
@ 目录 前言 demo环境 springbootTest Junit 总结 前言 最近公司要求2021年所有的项目代码单元测试覆盖率要达到90%,作为刚毕业的小白来说这简直就是噩梦啊,springb ...
- Failed to start ssh.service: Unit not found.
Failed to start ssh.service: Unit not found. 报错内容: [Centos7@localhost ~]$ service ssh start Redirect ...
- Uber三代API 生命周期管理平台实现 Uber
Uber三代API 生命周期管理平台实现 - InfoQ https://www.infoq.cn/article/H8Ml6L7vJGQz0efpWvyJ Uber 三代 API 生命周期管理平台实 ...
- redis 主从复制 和集群
redis集群最少三个节点 之间相互通信ping-pong 投票选举机制 主从复制 的话 最少六个节点 ,主三从三
- 两个list<Map<String,String>>放入一个list中
// public static void main(String[] args) {// List<Map<String, String>> list2 = new Arra ...
- 长连接 短连接 RST报文
https://baike.baidu.com/item/短连接 短连接(short connnection)是相对于长连接而言的概念,指的是在数据传送过程中,只在需要发送数据时,才去建立一个连接,数 ...
- HTMl5 特点 标签语法 以及标签
知识点关于HTML5 的特点以及其标签和标签语法.. <!-- [HTMl5 特点] 向下兼容 用户至上 化繁为简 无插件范围 访问通用性 引入语义 引入原生媒体支持--> <!-- ...
- Web信息收集之搜索引擎-GoogleHacking
Web信息收集之搜索引擎-GoogleHacking 一.信息收集概述 二.Google Hacking 2.1 site 2.2 filetype 2.3 inurl 2.4 intitle 2.5 ...