欢迎您,零度科技专业海外服务器租用
公司电话: 24小时电话: 

当前位置:首页>网站建设教程>SEO教程

目录导航

苹果apple-touch-icon-precomposed和apple-touch-icon两种设置的区别

香港高防(10G)机房 添加于 2013-12-29  

SEO教程

苹果safari浏览器当中apple-touch-icon-precomposed 和 apple-touch-icon属性是有区别的,之前在网上查了下相关的资料和苹果的开发文档手册,对这两中属性区别说的不够详细,导致现在大家开发的时候有些混淆。

苹果safari浏览器定义的这两种属性是为了苹果移动设备(ipod、ipad、iphone)对移动网站-mobile web进行收藏(“添加到桌面图标”)的时候增加的图标定义属性,当你建立一个移动网站(俗称:手机站,mobile web),避免不了为移动站的图标进行设置(这里有篇关于苹果meta设置详解的文章>>点击查看<<),在这篇文章当中尚未介绍这两中属性的区别,这篇文章就是弥补这一空缺。

图标设置的属性分为:

apple-touch-icon 和 apple-touch-icon-precomposed两种属性,从字面意思上可以看出,第一个是 “苹果移动设备图标”,第二个为“苹果移动设备初始图标样式”,由于第二个的意思完全搞不明白预设是预设的什么究竟有什么不同的地方,从官方资料当中也没有搞懂有什么明显的不同,通过实验得知了这两个明显的差异。

直接上图:

苹果apple-touch-icon-precomposed和apple-touch-icon两种设置的区别-图片1
苹果apple-touch-icon-precomposed和apple-touch-icon两种设置的区别-图片1

图片一:

从图中(图片一)右下角可以看出有两个Milanoo图标,分别是apple-touch-icon 和 apple-touch-icon-precomposed属性的图标,看出区别了没?

苹果apple-touch-icon-precomposed和apple-touch-icon两种设置的区别-图片2
苹果apple-touch-icon-precomposed和apple-touch-icon两种设置的区别-图片2
 
苹果apple-touch-icon-precomposed和apple-touch-icon两种设置的区别-图片3
苹果apple-touch-icon-precomposed和apple-touch-icon两种设置的区别-图片3

放大看大图:注意图标上面的光泽感,看明白了吧,使用apple-touch-icon属性的明显比使用apple-touch-icon-precomposed图标多出一个高光,因为在ios系统中对icon有一套规范,就是在ios设备的图标统一为“四边圆角”、“高光处理”,至于“图标阴影”,是ios设备中统一为所有桌面元素增加的,所以不作为图标单独处理的样式,由于在视觉上统一最重要的是形状的统一,所以“圆角”是必须的,但是对于“高光”苹果没有做出特别的强调,所以苹果设置当中把“高光”作为可选项,就产生了apple-touch-icon 和 apple-touch-icon-precomposed属性。

结论:

大家牢记了,说了通篇感觉最有用的就是最后两句。哈哈。

转载自零度科技:http://www.ldisp.com/a/seo/2013/2546.shtml

上一篇:用火狐浏览器模拟手机浏览器客户端的方法
下一篇:触摸屏网站开发系列(一)-ios web App应用程序(ios meta)

 
了解零度?

零度科技主营全球服务器租用,如果您有服务器租用需求请联系

海外服务器租用

推荐香港、美国、韩国。提供站群服务器、高防服务器租用

海外特价服务器

关注零度特价服务器频道,了解全球特价服务器。

0

业务咨询

    技术服务

      特价活动
        全站搜索
        热门搜索:
        会员
        0通知
        客服
        0特价
        搜索
        TOP
        香港高防服务器,远程桌面,韩国服务器,nginx,反向代理