Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[html] 第73天 favicon.ico有什么作用?怎么在页面中引用?常用尺寸有哪些?可以修改后缀名吗? #513

Open
haizhilin2013 opened this issue Jun 27, 2019 · 6 comments
Labels
html html

Comments

@haizhilin2013
Copy link
Collaborator

第73天 favicon.ico有什么作用?怎么在页面中引用?常用尺寸有哪些?可以修改后缀名吗?

@haizhilin2013 haizhilin2013 added the html html label Jun 27, 2019
@dddw001
Copy link

dddw001 commented Jun 28, 2019

作用:标签页左上角图标
引用:

尺寸: 16x16 32x32

@cheng0613
Copy link

cheng0613 commented Jun 28, 2019

作用:favicon 也叫收藏夹图标,我们经常从网页标签中看到这个图标,但它的作用往往不仅如此,favicon的存在能够让我们更加容易区分浏览器收藏夹中的内容。并且favicon 在一定程度上减轻服务器的流量带宽占用,一般为了提高网站的可用性,我们都会为自己的网站创建一个自定义的404错误文件,在这种情况下,如果网站没有相应的favicon.ico文件,每当有用户收藏网站/网页时, Web服务器都会调用这个自定义的404文件,并在网站的错误日志中记录。这显然是应该予以避免的。

引用方式:

尺寸:1616 3232

[引用]:https://segmentfault.com/a/1190000007764284

@ChasLui
Copy link

ChasLui commented Jun 28, 2019

作用: 挖矿
参考: https://juejin.im/pin/5a88f2d96d6def49864b74f4

@censek
Copy link

censek commented Dec 25, 2019

  • Favorites Icon,让浏览器的收藏夹中除显示相应的标题外,还以图标的方式区别不同的网站。
  • 强烈推荐使用后缀名.ico,对浏览器的支持范围广,一个.ico文件可以同时满足多个尺寸的需求。
  • 常用尺寸:1616 3232 48*48。
  • 引用方法:
    • 将图片 favicon.ico 放到 static 文件夹下 (用 vue-cli 搭建的Vue项目)
    • 然后在 index.html 中添加:
      <link rel="shortcut icon" type="image/x-icon" href="static/favicon.ico">

https://blog.csdn.net/Bule_daze/article/details/102718508

@chenshijin1
Copy link

网站 favicon 图标

favicon.ico 一般用于作为缩略的网站标志,它显示在浏览器的地址栏或者标签上。目前主要的浏览器都支持 favicon.ico 图标。

1、制作favicon图标

  • 把图标切成 png 图片
  • png 图片转换为 ico 图标,这需要借助于第三方转换网站,例如比特虫:http://www.bitbug.net/

2、使用favicon图标

  • favicon图标放到网站根目录下
  • HTML页面引入favicon图标

在html 页面里面的 元素之间引入代码

 <link rel="shortcut icon" href="favicon.ico"  type="image/x-icon"/> 

常用尺寸:16*16 32*32 48*48

作者:Jane_xxxxxy链接:https://juejin.cn/post/6855610710932586510

@MrZ2019
Copy link

MrZ2019 commented Jan 21, 2021

作用:favicon 也叫收藏夹图标,我们经常从网页标签中看到这个图标,但它的作用往往不仅如此,favicon的存在能够让我们更加容易区分浏览器收藏夹中的内容。并且favicon 在一定程度上减轻服务器的流量带宽占用,一般为了提高网站的可用性,我们都会为自己的网站创建一个自定义的404错误文件,在这种情况下,如果网站没有相应的favicon.ico文件,每当有用户收藏网站/网页时, Web服务器都会调用这个自定义的404文件,并在网站的错误日志中记录。这显然是应该予以避免的。

引用方式:

尺寸:16_16 32_32

[引用]:https://segmentfault.com/a/1190000007764284

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
html html
Projects
None yet
Development

No branches or pull requests

7 participants