{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 ゆ 、 Hurt° 的问题《What is currently the best way to get a favicon to》','https://www.manongdao.com/q-36615.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
What is currently the best way to get a favicon to display in all browsers that currently support it?
Please include:
Which image formats are supported by which browsers.
Which lines are needed in what places for the various browsers.
相关问题
- Views base64 encoded blob in HTML with PHP
- Is there a way to play audio on a mobile browser w
- HTML form is not sending $_POST values
- implementing html5 drag and drop photos with knock
-
Why does the box-shadow property not apply to a
To also support touch icons for tablets and smartphones I prefer the approach of HTML5Boilerplate
More information on touch icons can be found in this article.
With the current status of browser-support you don't even have to add the HTML tag for the favicon in your document. The browsers will search automaticly a list of files, see this example for iOS:
My advise is to not include a favicon in your document, but have a list of files ready in the root website:
(57px*57px)HiDPI (32x32px)When you download a template from html5boilerplate.com these are all included, you just have to replace them with your own icons.
Having a
favicon.*in your root directory is automatically detected by most browsers. You can ensure it's detected by using:Personally I use .png images but most formats should work.
I go for a belt and braces approach here.
I create a 32x32 icon in both the
.icoand.pngformats calledfavicon.icoandfavicon.png. The icon name doesn't really matter unless you are dealing with older browsers.favicon.icoat your site root to support the older browsers (optional and only relevant for older browsers.<head>element.Please note that:
.icofiles was registered as image/vnd.microsoft.icon by the IANA.typeattribute for the shortcut icon relationship and this is the only browser to support this relationship, it doesn't need to be supplied.Reference
IE6 cannot handle PNGs correctly, be warned.
Favicon must be an .ico file to work properly on all browsers.
Modern browsers also support PNG and GIF images.
I've found that in general the easiest way to create one is to use a freely available web service such as favicon.cc.
I use .ico format and put the following two lines within the
<head>element: