zoukankan      html  css  js  c++  java
  • 设置网页地址栏中的小图标

         网页中如何设置在网页地址栏中的小图标:

    下面我们就讲讲:

      <link rel="SHORTCUT ICON" href="http://****/*****.ico">

      <link rel="BOOKMARK" href="http://*****/*****.ico">

    这两个代码的作用。

    在浏览器地址栏有csdn有一个"圆圈"图标 如何在自己的jsp网页之中设置?

    通常做法是:

    要预先制作一个图标文件,大小为16*16像素。文件扩展名为ico,然后上传到相应目录中。

    在源文件“<head></head>”之间添加如下代码:

    <Link Rel="ICON NAME" href="http://图片的地址(注意与刚才的目录对应)">

    收藏夹:

    favicon.ico

    你随便用一种画象素的工具,画一个图标,然后起成这个名字,上传到你所有网页文件的那个文件夹里就行了。

    一般都会自动找这个favicon.ico的文件,只要有,就会显示。

    并且是根目录下

    地址栏的方法:

    只是在网页中多加入下面一条代码就行了。

    <link rel=”shortcut icon” href=”sample.png” type=”image/x-icon” />

    如果手头没有合适的工具制作图片,也可以选择一个自己喜欢的图片,然后到这个网站去自动生成一个。

    Favicon,即Favorites Icon的缩写,顾名思义,便是其可以让浏览器的收藏夹中除显示相应的标题外,还以图标的方式区别不同的网站。

    您是不是也希望为您的网站加上一个体现您的主页的风格和个性的图标呢?其实要实现这一目的非常简单。

    第一步,准备一个图标制作软件。

    首先您必须了解所谓的图标(Icon)是一种特殊的图形文件格式,它是以 .ico 作为扩展名。普通的图像设计软件无法使用这种格式,所以您需要到一个软件下载站点去下载一个图标制作软件。您也可以访问http: //www.favicon.com/,这里提供一个免费的在线“收藏夹”图标生成器,如果您 E 文够好的话,在这里您还可以了解到更多的关于“收藏夹”图标的知识。

    第二步,确定“收藏夹”图标的规格。

    “收藏夹”图标有着它特有的规格:图标的大小为 16 * 16(以像素为单位);所使用的颜色不得超过 16 色。 (为了清晰)

    第三步,设计一个属于您自己的图标。

    您可以将您的网站的 LOGO 做成一个缩图或者另外设计一个别具特色的图案来作为“收藏夹”图标。总之,它一定要是属于您自己的,并且能很好的代表您的网站的风格和个性。然后将这个图标文件命名为:favicon.ico。

    最后,将这个图标文件(favicon.ico)上传到您的网站所在的服务器的根目录下。

         网页标签ICON的制作方法

         favicon.ico图标在线制作,制作ico的一些软件+ico下载
          很多门户网站都有这个文件,Favicon可以方便用户在很多窗口的时候快速定位到他需要的那个TAB,人对图像的识别速度比抽象的文字还是要快很多。
          Favicon以前只是在IE收藏时会用到,当收藏网站时,标题名称前会显示favicon.ico,这样在众多的收藏网址中,你的网站就会比较显眼;但现在很多多窗口的浏览器都支持,打开网站时会直接显示在网站地址前以及标题前。

          相信现在很多朋友都在使用IE7.0了,IE7.0不但增加了标签页的功能,而且也可以显示Favicon。

          在RSS应用中,目前支持favicon的应用也越来越多……

          2、FAVICON.ICO文件制作
          favicon文件支持 16*16 和 32*32 两种格式,一般使用16*16。
          favicon.ico文件生成还是有些难度的,因为它不是标准的位图文件,需要用专门的favicon编辑器生成。
          还有一款小软件,魔法ICO v2.00.rar,可以让你把一张图片(支持 bmp,jpg,gif,png 等格式)转化成ico的图标文件,有16X16,32X32,48X48,64X64,72X72,96X96和128X128 多种尺寸,还可以提取程序里的图标。
          我很喜欢的一个在线favicon生成器服务:直接上传你喜欢的图片,直接生成16*16像素的favicon.ico文件,还有在线预览功能。
          另外推荐一个在线favicon生成器,http://www.chami.com/html-kit/services/favicon/                                      

    3、使用方法

    得到你的图标以后,把favicon.ico上传到服务器放在网站根目录下,然后在首页文件中<head>段插入:

    <link rel="shortcut icon" href="favicon.ico">
    <link rel="Bookmark" href="favicon.ico">

    如果你希望出现动画效果的favicon图标,那就上传animated_favicon1.gif并且添加如下的HTML标签:

    <link rel="shortcut icon" href="favicon.ico" >
    <link rel="icon" href="animated_favicon1.gif" type="image/gif" >

    提供几个在线生成ico图标相关网站和下载:

    在线生成favicon.ico地址:http://www.chami.com/html-kit/services/favicon

    有6个在线工具:http://www.chami.com/html-kit/services

    FavIcon from Pics //这个就是在线生成favicon.ico图标了,提交任何一个图片,它会给你生成一个ICO文件,并打包下载
    Favicon Validator //favicon验证
    Buddy Icon from Pics //把图片转换成ICO格式,还可制作PNG格式的背景图片
    Image Embellisher //制作特殊效果的图片,比如立方体,Windows徽标那样的波浪
    Online Image Splitter //切割图片
    Cookie Tester //cookie 测试
    得到你的图标以后,把favicon.ico上传到服务器放在网站根目录下

    在线制作ico图标 - ico图标转换工具
    http://www.bitbug.net/

    图标下载:
    http://download.pchome.net/php/dl.php?sid=17420
    制作ico的一些软件:

    icon sushi 1.18 Beta 1 
    Icon sushi 精致小巧的图标编辑程序,能将 *.bmp 档案转成 *.ico 的图示编辑工具,此外它更可以处理 Windows XP 用的图示文件,让你的桌面更加多采多姿。
    http://downloadfree.cn/Software/Catalog76/8343.html

    Picture To Icon 1.90 
    能将图片或屏幕的一部分转化为ICON图标,调整图标大小以及从资源库中提取icon。支持BMP, JPEG, GIF, CUR, WMF。
    http://www.onlinedown.net/soft/45891.htm

    魔法ICO 1.00 
    这是一个简单、小巧的图标工具,它为您提供以下功能: 
    1) 把.BMP和.PNG格式的图片批量转换成图标; 
    2) 从.EXE可执行文件中提取图标。 
    特别说明:由.BMP图片转换得到的图片色彩效果不太理想,建议把.BMP图片转换为.PNG格式,会得到更好的效果。转换图片格式可以用ACDSee,很方便。如果源.PNG图片带Alpha通道,则转换得到的图标也是32位带Alpha通道格式,效果很好。
    http://www.onlinedown.net/soft/41613.htm


  • 相关阅读:
    [Swift]LeetCode85. 最大矩形 | Maximal Rectangle
    [Swift]LeetCode84. 柱状图中最大的矩形 | Largest Rectangle in Histogram
    [Swift]LeetCode82. 删除排序链表中的重复元素 II | Remove Duplicates from Sorted List II
    [Swift]LeetCode81. 搜索旋转排序数组 II | Search in Rotated Sorted Array II
    [Swift]LeetCode80. 删除排序数组中的重复项 II | Remove Duplicates from Sorted Array II
    [Swift]常用正则表达式
    [Swift]LeetCode79. 单词搜索 | Word Search
    Unreal Enginer4特性介绍-牛B闪闪的UE4
    网站开发和企业级开发有什么区别?
    网站开发和企业级开发有什么区别?
  • 原文地址:https://www.cnblogs.com/tham/p/6827323.html
Copyright © 2011-2022 走看看