月光微博客 » 微网络 » 网页小技巧:在网站设置苹果图标

网页小技巧:在网站设置苹果图标

  随着苹果iPhone、iPod、iPad的大量使用,越来越多的人喜欢使用该设备内置的Safari 浏览网站,当用户把网站添加到主屏幕,使得该网站类似于一个应用程序的时候,会需要一个网站的图标。默认是自动将网页截屏并缩放到相应尺寸生成的图标,这显然并不好,我们可以自己设定这个图标。

  具体方法是,在网站首页的header部分,增加如下语句

  <link rel="apple-touch-icon" href="https://www.williamlong.info/images/apple-touch-icon.png"/>

  或者

  <link rel="apple-touch-icon-precomposed" href="https://www.williamlong.info/images/apple-touch-icon.png" />

  其中logo.png为一个 72X72 像素 PNG 格式的图标,如果你将图标命名为 apple-touch-icon.png 并放在根目录下,不需要任何语句,iPad 也会直接调用该图标。

相关文章

  1. 1. 卢松松 说道:
    不错,适合ipad方面的网站或用ipad浏览网站的人
  1. 2. 江苏SEO 说道:
    呵呵 学习了啊
  1. 3. 双子宅猫 说道:
    我在果壳网看到源代码中写了支持iPad、iPhone、iPod的三个代码,是否可以按照那个制作?代码有需要修改的吗?

发表留言