A few things about favicon.ico (it’s best to put it in the root directory)

Open any web page: for example, http://www.baidu.com/

You can see that there is an icon displayed on the browser tab header. This icon is: , which is what we often call favicon.ico.

Since this article mainly discusses favicon.ico and the different ways in which each browser handles it, we will create a new web project as follows:

firefox:

ie9:

Unfortunately, most ordinary users use 360 ​​browser, Sogou browser, QQ browser, etc.

Sogou Browser:

It can be seen that the favicon.ico in the root directory of the website is effective, so the favicon.ico icon in the root directory of the website is displayed.

Open 360 Browser:

Strange, where did the Google icon come from? . . . ? ? ?

Our faviconTestWeb has only 3 icons, one of which is wangyi.ico.baidu.ico.favicon.ico (the icon of cnblogs).

Why does 360 display the Google icon?

In fact, when 360 browser browses the web, it will ignore the port, that is, http://localhost:3529/home.html,

Firefox requests the icon corresponding to the href of the link.

Sogou Browser, etc.: The request is http://localhost:3529/favicon.ico.

360 browser, etc.: The request is http://localhost/favicon.ico,

That is, no matter whether you request http://host/home.html, http://host:333/home.html, or http://host/test/home.html.

It requests http://host/favicon.ico.

The evidence is to open the 360se installation directory:

So if your website's favicon.ico doesn't work, or if you want to make favicon.ico more compatible, use the following steps:

1: Check the favicon.ico in the root directory of the website, that is, http://host/favicon.ico., not http://host/some/favicon.ico.

2: Make sure <link rel="icon" href="http://host/favicon.ico" type="image/x-icon" />

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

Using http://host/favicon.ico

3: If your website has a port, or is a test version, then pay special attention to browsers such as 360, which will ignore the port number when requesting favicon.ico.