（转）apple-touch-icon-precomposed 和 apple-touch-icon属性区别

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

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

图标设置的属性分为：

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

直接上图：

图片一:

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

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

结论：

使用apple-touch-icon属性为“增加高光光亮的图标”；
使用apple-touch-icon-precomposed属性为“设计原图图标”；

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

原文作者：http://blog.sina.com.cn/s/blog_6d48e77101015krn.html

转载于:https://www.cnblogs.com/xiaohong/p/3817924.html

（转）apple-touch-icon-precomposed 和 apple-touch-icon属性区别相关推荐

【苹果推群发iMessage推】软件安装它起首将消息发送到Apple Push服务器，而后Apple Push服务器将消息发送到装配了应用程序的手机
推荐内容IMESSGAE相关作者推荐内容 iMessage苹果推软件 *** 点击即可查看作者要求内容信息作者推荐内容 1.家庭推内容 *** 点击即可查看作者要求内容信息作者推荐内容 2.相册 ...
Apple Music(应用内打开Apple Music)
前言.我要讲的App Music是StoreKit框架下的Apple Music.我可没那么多闲心去讲Apple Music应用怎么用- 首先,这是一个可以让用户去订阅Apple Music与提供对A ...
apple tv 开发_您应该从Apple TV 3升级到Apple TV 4还是4K？
apple tv 开发 If you're still stuck in the dinosaur ages with your Apple TV 3, you might be curious ab ...
apple邀请码发放（apple邀请码，apple卡密获取）
apple邀请码是什么.apple邀请码多少,apple卡密是 apple注册邀请码:110211 请大家用正规的邀请码注册避免造成不必要的损失 apple官方卡密:http://t.cn/EXlI9 ...
切换Apple Store ID后，Apple Mucic资料库无法加载问题的解决方案
问题提出:多个apple store id经常切换,切换apple id后apple music资料库会一直加载不出来,此类问题会出现在iPhone上,电脑iTunes上没有问题,iPad上未知.尝试 ...
java touch创建文件_Java FileUtils.touch方法代碼示例
本文整理匯總了Java中org.apache.commons.io.FileUtils.touch方法的典型用法代碼示例.如果您正苦於以下問題:Java FileUtils.touch方法的具體用法? ...
linux中touch命令含义,Linux中touch命令起什么作用呢？
摘要: 下文讲述Linux中touch命令的功能说明,如下所示: touch命令功能: 其功能为: 1.创建一个空文件 2.修改已存在文件的时间戳属性 touch命令的语法格式: touch [参数] ...
Apple Watch Series 6和Apple Watch SE的区别
Apple Watch SE 在屏幕尺寸方面与Apple Watch Series 6 保持了一致,不过Apple Watch SE 的屏幕不支持全天候常亮显示. Apple Watch Series ...
The bundle does not contain an app icon for iPhone / iPod Touch of exactly '57x57' pixels
遇到这个问题问题,搜索了一圈要么不知道,要么喊改deploymenet target, 最后我是在项目属性-info-icon files(ios5)-下面添加了一个icon,然后弄了个icon.pn ...
iOS开发之3D Touch（快速添加3D Touch功能）
1. 概述在支持3D Touch的设备上,用户可以通过对触摸屏施加不同程度的压力来访问其他功能,应用程序可以通过显示上下文菜单(或支持Peek和Pop)来响应,以显示一些可供用户操作的选项或者行为. ...

（转）apple-touch-icon-precomposed 和 apple-touch-icon属性区别

（转）apple-touch-icon-precomposed 和 apple-touch-icon属性区别相关推荐

最新文章

热门文章