HTML

[form] HTML - <input type="range"> 태그 - 지정범위 내 입력값 지정 (= 인풋레인지타입/레인지타입인풋/레인지인풋 요소)

목차
  1. <input type="range"> 예제 - 지정범위 내 입력값 입력
  2. <input type="range"> 정의
  3. <input type="range"> 구문

 

<input type="range"> 예제 - 지정범위 내 입력값 입력

 

<form action="/action_page.php">

  <label for="score">score</label>

  <input type="range" id="score" name="score" min="0" max="100" value="70">

  <input type="submit">

</form>

 

결과보기

 

<input type="range"> 정의

 

지정범위 내 입력값을 입력 가능한 INPUT 요소. (기본범위: 0 ~ 100)

 



1. 아래 속성 이용해 (범위/입력간격/기본값) 지정 가능

  • min 속성 - 최소값 지정
  • max 속성 - 최대값 지정
  • step 속성 - 입력값 간격
  • value 속성 - 기본값 지정

 

2.

<label> 태그 사용 시, 웹접근성 향상됨.

 

3.

IE10 이상 주요 최신브라우저 모두 지원.

 

4. MDN <input type="range"> 예제보기

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range

 

 

<input type="range"> 구문

 

<input type="range">

 

 


분류 제목
attribute HTML - ondragenter 속성 - 드래그 한 요소가 드롭박스에 들어갈 때 실행 (= ondragen…
attribute HTML - ondragleave 속성 - 드래그 한 요소가 드롭박스 이탈 시 실행 (= ondragleav…
attribute HTML - ondragover 속성 - 드래그 한 요소가 드롭박스 위에 위치 시 실행 (= ondragov…
attribute HTML - ondragstart 속성 - 드래그 시작 시 실행 (= ondragstart속성 = 온드래그스…
attribute HTML - ondrop 속성 - 드래그 한 요소를 드롭 할 때 실행 (= ondrag속성 = 온드래그속성)…
attribute HTML - ondurationchange 속성 - 재생시간 데이터가 변경될 때 실행 (= onduratio…
attribute HTML - onemptied 속성 - 미디어 소스가 비어있거나 삭제된 경우에 실행 (= onemptied속…
attribute HTML - onended 속성 - 미디어 재생 끝날 때 실행 (= onended속성 = 온엔디드속성) ※ …
attribute HTML - onerror 속성 - 미디어파일 로딩 에러 시 실행 (= onerror속성 = 온에러속성) ※…
attribute HTML - onfocus 속성 ★ - 포커스 설정 시 실행 (= onfocus속성 = 온포커스속성) ※ o…
attribute HTML - onhashchange 속성 - 링크 해시값 변경 시 실행 (= onhashchange속성 = …
attribute HTML - oninput 속성 ★ - 사용자 입력값 변경 시 바로 실행 (= oninput속성 = 온인풋속…
attribute HTML - oninvalid 속성 - 유효하지 않은 입력값 제출 시 실행 (= oninvalid속성 = 온…
attribute HTML - onkeydown 속성 - 키보드키 내려갈 때 실행 (= onkeydown속성 = 온키다운속성)…
attribute HTML - onkeypress 속성 - [페기예고] 키보드키 눌렀을 때 실행 (= onkeypress속성 …
16/24
목록
 홈  PC버전 로그인 일본어
그누앞단언어
그누뒷단언어
그외코딩언어
그누보드
제작의뢰
Q&A
커뮤니티
웹유틸
회원센터
홈짱닷컴 PC버전 로그인