• 회원가입
  • 로그인
  • 구글아이디로 로그인

[etc] HTML - inputmode 전역속성 - 사용자 입력값 데이터타입 힌트 (= inputmode속성 = 인풋모드속성)

목차
  1. inputmode 정의
  2. inputmode 속성값

 

inputmode 정의

 

사용자가 요소나 요소의 콘텐츠 편집 때 입력 가능한 데이터 타입 힌트 제공하는 열거형 속성.

 


PS.

Chrome, Opera 브라우저 지원. (단, IE, Firefox, Safari는 지원 X)

 


inputmode 속성값

inputmode 속성에 사용 가능한 속성값 종류는 아래와 같음.

 

none

가상 키보드 사용 X. (페이지가 자체 키보드나 입력 컨트롤을 구현할 때 사용.)

 

text (기본값)

사용자의 현재 로케일에 맞는 표준 키보드 제공.

 

decimal

사용자의 로케일에 맞는 소숫점(보통 , 또는 .)을 제공하는 숫자형 키보드 제공. ※ 장치에 따라 음의 부호(-) 제공할 수도, 안 할 수도 있음.

 

numeric

숫자형 키보드를 제공. 소숫점은 없으며, 음의 부호는 제공할 수도, 제공 안 할 수도 있음.

 

tel

전화번호 키보드 제공. 숫자 0~9, 별표(*), 해시(샵, #) 키를 포함. 일반적인 경우, 반드시 전화번호를 필요로 하는 입력 칸에는 <input type="tel">을 사용해야 함.

 

search

검색 입력 칸에 최적화한 가상 키보드 제공. (예제) 엔터/제출 키가 "검색" 아이콘이나 레이블을 가질 수 있음. 일반적인 경우, 반드시 검색 질의 필요로 하는 입력 칸에는 <input type="search">를 사용해야 함.

 

email

이메일 입력에 최적화한 가상 키보드 제공. 보통 @ 키 등을 제공. 일반적인 경우, 반드시 이메일을 필요로 하는 입력 칸에는 <input type="email">을 사용해야 함.

 

url

URL 입력에 최적화한 가상 키보드를 제공. 보통 / 키를 누르기 편한 곳에 배치하며, 세션 히스토리 접근 기능 등을 추가하기도 함. 일반적인 경우, 반드시 URL을 필요로 하는 입력 칸에는 inputmode 대신 <input type="url">을 사용해야 함.

 


 


분류 제목
formatting HTML - <time> 태그 - 브라우저 인식 가능 날짜시간 지정 (= time태그 = 타임태그, IE9)
formatting HTML - <wbr> 태그 - 한 단어 내 줄바꿈 위치/지점 표시 (= wbr태그 = 더블유비알태그)
form HTML - <datalist> 태그 - 입력가능값리스트 (= datalist태그 = 데이터리스트태그)
form HTML - <keygen> 태그 - 암호화쌍키생성 (= keygen태그 = 키젠태그)
form HTML - <output> 태그 - 계산 결과값 출력 (= output태그 = 아웃풋태그)
image HTML - <canvas> 태그 - 그림그리기 (= canvas태그 = 캔버스태그)
image HTML - <svg> 태그 - 그림그리기 (= 동적그림 = svg태그 = 에스브이지태그)
image HTML - <figure> 태그 - 독립콘텐츠표시 (= figure태그 = 피겨태그)
image HTML - <figcaption> 태그 - 독립콘텐츠제목 (= figcaption태그 = 피그캡션태그) (…
media HTML - <audio> 태그 ★ - 음성파일재생 (= audio태그 = 오디오태그)
media HTML - <source> 태그 - 미디어소스 불러오기 (= source태그 = 소스태그)
media HTML - <track> 태그 - 미디어트랙정보 (= track태그 = 트랙태그)</tr>
media HTML - <video> 태그 ★ - 영상재생 (= video태그 = 비디오태그) ※ 영상파일형식별로 브…
link HTML - <nav> 태그 ★ - 네비게이션링크모음 (= nav태그 = 네브태그)
list HTML - <menuitem> 태그 - 마우스오른쪽 팝업메뉴 (= menuitem태그 = 메뉴아이템태그) …
style HTML - <header> 태그 ★ - 단락머리말 (= header태그 = 헤더태그 = 헤더요소) (HT…
style HTML - <footer> 태그 ★ - 단락꼬릿말 (= footer태그 = footer요소 = 푸터태그 =…
style HTML - <main> 태그 ★ - 문서기본내용 (= main태그 = 메인태그)
style HTML - <section> 태그 ★ - 연관된 문서단락 (= section태그 = 섹션태그, IE9)
style HTML - <article> 태그 ★ - 자족적인 독립콘텐츠 (= 아티클태그 = article태그. IE9…
6/18
목록
찾아주셔서 감사합니다. Since 2012