반응형
모바일 기기에서 웹브라우저로 사이트 접속 시 즐겨찾기나 북마크 설정으로 페이지 바로가기 아이콘을 만들 수 있음.
아이폰과 안드로이드에서 link태그를 이용하면 되고 사용법은 약간 다른부분,,
1. 아이폰(ios)
2. 안드로이드(android)
안드로이드는 72x72사이즈 png이미지를 지정해주면 됨.
아이폰은 자동으로 리사이징되지만 고정사이즈 이미지를 사용하면 깨져보이므로
사이즈별로 지정해주는게 좋음.
iPhone 3gs | 57x57(px) |
iPad | 72x72(px) |
iPhone 4/4s | 114x114(px) |
New iPad | 144x144(px) |
※ 아이폰 사이즈 지정
아이폰은 자동으로 모서리 둥글게, 광택 효과가 적용이 됨ㅎ.
그래서 아이콘 제작할 때 따로 효과를 주지 않아도 되고, 모서리를 둥글게 만들 필요가 없음.
아이폰의 자동 효과말고 원본 이미지 그대로 아이콘을 적용할수 있음.
rel속성에서 “apple-touch-icon” 대신에 “apple-touch-icon-precomposed”를 지정하면 된다.
반응형
'프로그래밍 > HTML+CSS' 카테고리의 다른 글
css 모바일 a태그 클릭시 탭효과 제거 (0) | 2016.07.25 |
---|---|
HTML 특수문자 코드표 (0) | 2016.07.05 |
html&css 인쇄 설정/javascript print (0) | 2015.04.17 |
모바일 상단하단 고정 레이아웃 (1) | 2014.11.07 |
코딩 시 사용하는 템플릿 기본틀 (0) | 2014.10.15 |