蘋果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屬性爲“設計原圖圖標”；
大家牢記了，說了通篇感覺最有用的就是最後兩句。哈哈。
