ios safari 添加圖標

持有ios設備的童鞋應該都用過Safari，也許你會以爲他不如UC好用，可是你決不能忽略它的強大，在Wi-Fi下Safari確實十分給力。 每個web app的開發者更沒法忽略這個瀏覽器，在Safari上能夠實現好多使人興奮的功能，那感受，做爲開發者的你必定懂得。

這裏向你們介紹一下如何更方便的使用Safari瀏覽你喜歡的網站，前提是這個網站已經爲ios製做了主屏幕圖標喲~

 

也許你會發現你的同事在使在ios時點擊桌面的一個圖標就會全屏打開一個網站，就是下圖這種主屏幕圖標

這種圖標看起來很像一個native的應用程序，實際上它只是一個網站的快捷入口，這也是我下面要說的如何讓網站支持這種圖標的添加。

下面是代碼，很簡單的一段：

ios會本身把圖片裁切成圓弧狀，而且添加弧形高亮的效果，因此你只須要給出一張普通的四方圖片就能夠，剩下的事情ios會幫你處理。

當第一次打開主屏幕添加的這個圖標會全屏展現網站，以下圖（如何製做for ios版本wordpress請看爲你的博客打造iphone版本）

這樣能夠更好的展現你所添加的網站，也能夠更精確的測試出滿屏的第一屏的位置。

你可能會說這個功能可能會用不少人不知道，沒問題，下面就來解決這個問題



引入這個css和js以後就會出現下圖的提示，若是你要使用的話建議保存到本身的空間下引用，畢竟這個使用的國外的地址，速度上確定不理想。

到這裏就實現了網站for ios版本添加到主屏幕圖標的問題，你也能夠本身試一下，祝你好運哦。