百分百源码网-让建站变得如此简单! 登录 注册 签到领金币!

主页 | 如何升级VIP | TAG标签

当前位置: 主页>网站教程>html5教程> 怎样在网页地址栏中增加特定图标?
分享文章到:

怎样在网页地址栏中增加特定图标?

发布时间:09/01 来源:未知 浏览: 关键词:
大多数在线网站都有本人的特定图标(如下图),这个图片一样会在网站的地址栏上显示。在大多数状况下,它们会被用作网站的标记。那么怎样在网页地址栏增加特点图标?本篇文章就给大家介绍在网页地址栏上增加特点图标的办法。有必然的参照 价值,有需要的伴侣可以参照 一下,但愿对你们有所帮忙。

1.jpg

第一我们要知道这个特定图标是啥?有什么作用?

它是一个favicon文件,当我们在网站上使用favicon,会比在阅读器上看到空白文档图标要好得多,此外,这样会使得网站看起来愈加专业一点。

下面我们就来介绍一下向网站增加favicon图标的简便办法。

办法一:让阅读器主动猎取您的图标(无需更换网站代码)

大多数阅读器会主动检测位于您网站名目中的favicon.ico文件,并将其设定为您网站的图标。这是向网站增加favicon的最简便办法。

我们来看看实现步骤

1、必需具有任何图像格局(jpg,bmp,gif,png)的方形图像,才能在阅读器中正常显示。当然,非方形图像也可以工作,但是,这些图标大概看起来不专业。

2、需要将图像转换为.ico格局。网上有许多工具可以做到这一点,本文内,我们使用在线转换,网址:convertico.com。

3、翻开convertico.com后,你将看到一个用于选中和上传图像文件的按钮。

2.png

4、单击按钮并选中您喜爱的图像,在您连续操纵后,图像将主动转换并显示在网站的右侧以供下载:

4.png

5、单击“ 下载”箭头按钮下载图像,并将.ico文件留存在运算机的任何位置。

6、此刻将文件重命名为favicon.ico,由于阅读器只会主动识别此名称。

7、最后一步是将此文件上传到你网站文件所在的主机名目中。上传文件,可以使用文件治理器或FTP客户端。

当您的favicon.ico文件与其他网站文件一起上传时,阅读器将主动收集它并在阅读器中显示该图像。

3.png

办法二:使用常规图像并在网站代码中指定它

假如您认为将图像转换为其他格局太费事,您必定可以使用常规图像作为网站的图标。

我们来看看实现步骤

1、一样必需具有任何图像格局(jpg,bmp,gif,png)的方形图像,才能在阅读器中正常显示。当然,非方形图像也可以工作,但是,这些图标大概看起来不专业。

2、将此文件上传到您的网站文件所在的主机名目。

3、此刻,您需要在网站代码中指定要用作favicon的图像。<head></head>在网站代码中的代码之间增加此行:

<link rel="shortcut icon" type="image/png" href="/favicon.png"/>

说明:

type="image/png"将png零件更换favicon.png为图像格局并更换为文件名。

HTML代码此刻看起来与此相似:

5.png

您的图像此刻应显示为网站的图标:

3.png

注:假如看不到新的图标,请清除阅读器的缓存并从新启动它。

以上就是怎样在网页地址栏中增加特定图标?的具体内容,更多请关注百分百源码网其它相关文章!

打赏

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

百分百源码网 建议打赏1~10元,土豪随意,感谢您的阅读!

共有151人阅读,期待你的评论!发表评论
昵称: 网址: 验证码: 点击我更换图片
最新评论

本文标签

广告赞助

能出一分力是一分吧!

订阅获得更多模板

本文标签

广告赞助

订阅获得更多模板