您现在的位置是:首页 > 前端技术 > JavaScriptJavaScript

网站前面的图标是怎么弄的??

江湖快报网2023-01-23 17:49:52【JavaScript】人已围观

简介在<head><head>标记之间输入
<link rel=“icon”href=“picture location”type=“image/x-icon”/>
或者用favicon来表示:
规格为32×32、48×48、64×64、128×128。直接使

在<head><head>标记之间输入

<link rel=“icon”href=“picture location”type=“image/x-icon”/>

或者用favicon来表示:

规格为32×32、48×48、64×64、128×128。直接使用PS作为图片,命名为favicon.ico,然后使用FTP软件上传到网站的根目录,替换原始文件。如果你不想使用FTP软件,你也可以在网站的后台替换它。

扩展资料:

关于favicon图标的使用

Favicon.ico通常用作网站的缩写徽标,显示在地址栏或浏览器的标签上,用于显示网站的徽标,如下面的百度徽标。目前,主流浏览器支持favicon.ico图标。

一。生成图标ico

许多网站支持图片在线转换成ICO格式,图片大小通常在几十万左右

在线生成ICO

2。以HTML格式设置

成功生成favicon.ico图像文件后,浏览器将自动弹出压缩文件

将favicon.ico映像放入根目录(或其他目录)中的压缩文件中

在页面源文件的<head><head>标记之间插入

<head>

...

<link rel=“快捷方式图标”ref=“/favicon.ico”/>

</head>

在href中指向ICO图片的路径

网站前面的图标是叫favicon.ico图标,也是显示一个自己个性的标志。你可以制作一个ico图标,并命名为favicon.ico。

操作步骤:

第一、百度一下“.ico图片制作”,就能找到很多.ico图片制作软件。

第二、点击.ico图片制作软件,

第三、选择一张图片,任意图片都可以,不过还是建议:用正方形图片,图片中标志尽量占据绝大部分,这样生成的.ico图片才能更加清晰。

第四、上传成功后,需要选择.ico图片的尺寸大小,这个可以按照自己的需求来选择,一般选择48*48的比较好,这样的会比较清晰一些。

第五、.ico图片制作软件生成一个.ico图标,但是要传到网站上,必须修改图片的名称为favicon.ico,这是固定格式,然后用FTP将favicon.ico图片上传到网站根目录下即可。

某一些大网站都有自己的标志(网站前面的图标)。如果浏览器支持图表显示,图标的就会显示出来。浏览器版本低,就会无法显示图标。在网页中使用图标: 浏览器调用Favicon(图标)的原则是首先在网页所在的目录下寻找Favicon.ico文件,如果没有,便到网站的根目录下寻找。 因此,在网页中使用Favicon最简单的办法便是将制作好的图标文件命名为Favicon.ico,然后将其上传到网站的根目录即可。 网页身就是有一段段代码组成的(不明白的话 浏览网页的时候按下 F12 键就知道了)网站的图标,在你浏览网页的时候,已经被存到你的浏览器缓存之下了,打开缓存就可以看得见。 制作Favicon.ico的方法相当简单,首先,利用图形工具创建2个反映网站主题的256色的小图片:1个为32×32像素,另一个为16 ×16像素。需要注意的是,调色板要选用“Windows 默认调色板”,不然,在最终的效果展示中图形可能会发生迥异于您初衷的颜色上变化。 至于在浏览器中使用时16×16像素的图片已经足够,为什么还要准备32×32像素的图片,原因在于,正如上文所言,favicon也显示在地址栏中,用户可以拖曳favicon到桌面以建立到网站的快捷方式,而桌面图标则要以32×32显示的,如果您的Favicon.ico不包括32像素的图片,系统就只能使用默认的浏览器图标来标注网站/网页,如Internet Explorer的蓝色“e”,起不到意欲通过Favicon.ico打造网站品牌的作用。 图片制作好后,使用如Image2Ico之类的小程序即可将2张图片转换到一个Icon文件中 在网页中使用Favicon.ico 浏览器调用Favicon的原则是首先在网页所在的目录下寻找Favicon.ico文件,如果没有,便到网站的根目录下寻找。 因此,在网页中使用Favicon最简单的办法便是将制作好的图标文件命名为Favicon.ico,然后将其上传到网站的根目录即可。 如果您需要将Favicon.ico放到其他目录下,或者希望让不同的网页显示不同的Favicon,就需要在网页Html文件中做设定了,具体设置也很简单,在Html中的<head>部分加入如下的代码: 程序代码: <link rel=icon href=/dir/favicon.ico mce_href=/dir/favicon.ico type=image/x-icon> <link rel=shortcut icon href=/dir/favicon.ico mce_href=/dir/favicon.ico type=image/x-icon> Firefox还支持GIF动画格式的Favicon,使用方法如下: 首先制作一个16*16的gif动画,然后在html代码<head></head>中加入如下代码: 程序代码 <link rel=shortcut icon href=favicon.ico > <link rel=icon href=animated_favicon.gif type=image/gif >即可。

最好是用火狐浏览器,打开你要编辑的网页,点右键,查看网页源代码,然后按他说的做就行了

Tags:图标   前面   怎么

很赞哦! ()

文章评论

    共有条评论来说两句吧...

    用户名:

    验证码:

本站推荐