如何将我网站的徽标作为浏览器选项卡中的图标图像? [英] How do I put my website's logo to be the icon image in browser tabs?

查看:112
本文介绍了如何将我网站的徽标作为浏览器选项卡中的图标图像?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

浏览器标签页面标题旁边的图片 - 如何链接图片?

被称为' favicon ',它是一个小方形 .ico 文件,这是favicon的标准文件类型。您也可以使用 .png .gif ,但您应该遵循标准以获得更好的兼容性。



要为您的网站设置一个,您应该:


  1. 您的徽标(最好是32x32或16x16像素,据我所知没有最大尺寸*),并将其转换为 .ico 文件。你可以在Gimp,Photoshop(在一个插件)或 Favicon.cc RealFaviconGenerator

  2. 然后,你有两种方法来设置它:

    >

    A)将它放在您网站的根文件夹/目录上(位于 index.html )
    ,名称 favicon.ico





    每个 .html < head>< / head> 标签之间的链接c $ c $>您的网站上的文件,如下所示:

     < head> 
    < link rel =快捷图标type =image / x-iconhref =favicon.ico/>
    < / head>


如果您想查看 favicon 从任何网站,只需写 www.url.com/favicon.ico ,你会(可能)看到它。 Stackoverflow的图标为16x16像素, Wikipedia 为32x32。



*:甚至有浏览器问题没有文件大小的限制。你可以很容易地崩溃浏览器与一个非常大的图标,更多的信息[这里] [8]


The image next to the page title in the browser tab - how can you link an image here?

解决方案

That image is called 'favicon' and it's a small square shaped .ico file, which is the standard file type for favicons. You could use .png or .gif too, but you should follow the standard for better compatibility.

To set one for your website you should:

  1. Make a square image of your logo (preferably 32x32 or 16x16 pixels, as far as I know there's no max size*), and transform it into an .ico file. You can do this on Gimp, Photoshop (with help of a plugin) or a website like Favicon.cc or RealFaviconGenerator.

  2. Then, you have two ways of setting it up:

    A) Placing it on the root folder/directory of your website (next to index.html) with the name favicon.ico.

    or

    B) Link to it between the <head></head> tags of every .html file on your site, like this:

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

If you want to see the favicon from any website, just write www.url.com/favicon.ico and you'll (probably) see it. Stackoverflow's favicon is 16x16 pixels and Wikipedia is 32x32.

*: There's even a browser problem with no filesize limit. You could easily crash a browser with an exceedingly large favicon, more info [here][8]

这篇关于如何将我网站的徽标作为浏览器选项卡中的图标图像?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆