티스토리 뷰

스터디/HTML, CSS

모바일, 태블릿 고려해서 웹만들기

밀크티냠냠 2022. 4. 28. 03:18

1. 클릭시 생기는 아웃라인, 박스 없애기!

 

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

-- 모바일이나 웹에서 테두리가 생긴다면... 아웃라인만 없애주면 된다. input:focus{ outline:none; } 그런데 모바일에서는 하이라이트생기는 경우가 있다. IOS(아이폰,,아이패드 등..), Android 등의 웹킷

gahyun-web-diary.tistory.com

input:focus{
	outline:none;
	-webkit-tap-highlight-color: transparent;
}

 

 

-webkit-tap-highlight-color - CSS: Cascading Style Sheets | MDN

-webkit-tap-highlight-color is a non-standard CSS property that sets the color of the highlight that appears over a link while it's being tapped. The highlighting indicates to the user that their tap is being successfully recognized, and indicates which el

developer.mozilla.org

 

 

 

2. 더블클릭, hover 고려하기

 

모바일에서 더블클릭? hover? 다르게 적용된다면 이 글을 보자

모바일 웹에서 hover 효과 제거하기 모바일(터치 디바이스)에서는 마우스 커서가 없기 때문에 hover 효과를 줄 수 없다.PC에서처럼 css에 hover 효과를 넣게 되면 해당 요소를 두번 터치해야 원하는 동

breathof.tistory.com

 

저작자표시 비영리 변경금지 (새창열림)

'스터디 > HTML, CSS' 카테고리의 다른 글

팝업 만들기, localStorage로 오늘 하루 그만보기 만들기  (0) 2023.02.03
CSS gradient() 그라디언트로 만들수 있는 것들  (0) 2022.05.27
border에 그라데이션 넣기  (0) 2022.04.28
뒤로가기 버튼, 앞으로가기 버튼  (0) 2022.04.27
모바일에서 더블클릭? hover? 다르게 적용된다면 이 글을 보자  (0) 2022.04.27
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG more
«   2025/06   »
일 월 화 수 목 금 토
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
글 보관함