爲webapp應用制定IOS,Android桌面快捷圖標

製做方式比較簡單,即在webapphtml

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <link rel="apple-touch-icon" href="dwred.png" />
    <link rel="apple-touch-icon" sizes="72x72" href="dwred.png" />
    <link rel="apple-touch-icon" sizes="114x114" href="dwred.png" />
    <link rel="apple-touch-icon" sizes="144x144" href="dwred.png" />
    <title></title>
</head>
<body>

</body>
</html>

 

的頁面head中插入如下代碼:android

<link rel="apple-touch-icon" href="touch-icon-iphone.png" /> 
<link rel="apple-touch-icon" sizes="72x72" href="touch-icon-ipad.png" /> 
<link rel="apple-touch-icon" sizes="114x114" href="touch-icon-iphone-retina.png" /> 
<link rel="apple-touch-icon" sizes="144x144" href="touch-icon-ipad-retina.png" />

能夠看到,針對不一樣分辨率的設備將會引用不一樣的png文件,此處png則爲桌面快捷圖標文件。上傳文件到服務器上,用Safari或者Chrome打開網站,按菜單中的添加到主屏幕便可,這裏截圖都是android的web

相關文章
相關標籤/搜索