Notice
Recent Posts
Recent Comments
Link
«   2024/04   »
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30
Archives
Today
Total
관리 메뉴

web sprit

[HTML5] meta 및 link 태그를 이용한 모바일사파리 조작. 본문

웹5/HTML5

[HTML5] meta 및 link 태그를 이용한 모바일사파리 조작.

커드만 2018. 12. 21. 09:50

1. 풀 스크린 화면

1
<meta name="apple-mobile-web-app-capable" content="yes">
cs

홈스크린으로 등록하면 사파리 모바일에서 풀스크린으로 시작합니다.



2. 시작 시 화면

1
<link rel="apple-touch-startup-image" href="loading.png">
cs

풀스크린 모드에서 위의 태그로 시작화면을 띄울 수 있습니다.



3. 상태바 없애기

1
<meta name="apple-mobile-web-app-status-bar-style" content="black">
cs

풀스크린 모드에서 상태바 조정이 가능합니다.



4. 웹 클립 아이콘

1
2
<link rel="apple-touch-icon" href="gilbird.png"
<link rel="apple-touch-icon-precomposed" href="gilbird.png">
cs

사파리에서 특정 페이지를 홈 스크린으로 만들때 모바일 사파리는 아이콘으로 만들 웹 클립 파일을 해당 웹페이지에서 찾습니다.(파일명: apple-touch-icon-precomposed.png)

다른 방법으로는 link 태그로 지정하면 됩니다.

Comments