6.4　为网站添加图标

6.4　为网站添加图标

出现在地址栏、标签页和书签上的小图标称作favicon，是favorites icon（收藏夹）的简称。iphone、ipad等苹果设备的主界面要求更大尺寸的图标，推荐大小为114像素×114像素。

为网站添加图标的步骤如下：

（1）创建一个16像素×16像素的图像，保存为ICO或PNG、GIF格式。

（2）为触屏设备创建一个114像素×114像素的图像，保存为PNG格式。

（3）在HTML5文档的head部分，输入“＜link rel＝＂shortcut icon＂href＝＂favicon.ico＂/＞”，其中“favicon.ico”是服务器上图标的名称和位置；如果图像为PNG格式，则输入“＜link rel＝＂icon＂type＝＂image/png＂href＝＂favicon.ico＂/＞”；如果图像为GIF格式，则输入“＜link rel＝＂icon＂type＝＂image/gif＂href＝＂favicon.ico＂/＞”。

（4）在HTML5文档的head部分，输入“＜link rel＝＂apple-touch-icon＂href＝＂appletouch-icon.png＂/＞”。其中“apple-touch-icon.png”是服务器上图标的名称和位置。

为网站添加图标的代码如下：

运行结果如图6-7所示。

图6-7　为网站添加图标实例运行结果