[CSS]모바일에서 영역 클릭시 생시는 파란 박스 없애기

-- 모바일이나 웹에서 테두리가 생긴다면...

아웃라인만 없애주면 된다. 

input:focus{
	outline:none;
}

 

 

그런데 모바일에서는 하이라이트생기는 경우가 있다. 

 

 

 

IOS(아이폰,,아이패드 등..), Android 등의 웹킷 기반 브라우저(크롬, 사파리 등)에서 화면을 터치하면 

 

해당위치에 파란박스 영역이 생긴다. (하이라이트)

 

이를 없애기 위해서는 

-webkit-tap-highlight-color : 컬러;

를 사용해 색을 지정한다.

없애고 싶다면 

rgba(0,0,0,0) 으로 투명하게 설정하거나 transparent로 투명하게 만들어준다. 

 

 

 

 

웹표준은 아니라 브라우저마다 다르게 적용될수 있다고 한다......

자세한 사항은 아래에서 확인할 수 있다.

 

https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-color

-webkit-tap-highlight-color