Notice
Recent Posts
Recent Comments
Link
관리 메뉴

web sprit

[HTML] 아이폰(IOS) 모바일에서 전화번호 링크 색 원래 색으로 변경 본문

웹1.0/HTML

[HTML] 아이폰(IOS) 모바일에서 전화번호 링크 색 원래 색으로 변경

커드만 2016. 12. 29. 22:46

모바일 제작이나 반응형웹을 제작할때 부딪힐 수 있는 문제입니다.

마크업을 작업하면 PC로 비교해보면서 작업을 하게 되는데요.

쉽게 지나치고 모바일에서 확인했을때 전화번호로 되어진 부분

예) 010-xxxx-xxxx


전화번호 부분을 IOS 모바일로 확인했을때 링크로 인식하여 내가 의도치 않은 색으로 지정되어 집니다.

황당하죠....이 현상은 IOS는 전화번호 자동링크로 인식하여 화면의 UI 나 디자인에 영향을 미칩니다.


그럼 바로 해결 해야죠. 아래의 메타태그를 head 태그 안에 입력해 줍니다.

<meta name="format-detection" content="telephone=no" />


그럼 원래 지정했던 색이 적용되어 모바일에서 확인하실 수 있습니다.

IOS 에서 자동 링크로 전화걸기를 연결하지말고 원래 디자인은 적용하면서 전화걸기 링크를 넣으려면 다음과 같은 방법을 사용하십시오.

<a href="tel:010-xxxx-xxxx">전화걸기</a>

그럼 모바일에서 전화번호를 누르면 전화걸기 alert 가 뜰것 입니다.

Comments