5-4. 레인지
■ 레인지(range)
레인지의 스타일을 지정하려면 <input> 요소에 type 속성을 "range"로 설정하고, 클래스 .form-range를 사용합니다.
범위 번호 사이의 기본 간격은 1입니다. step 속성을 이용하면 번호를 변경할 수 있습니다. 범위의 최솟값은 0이고 최댓값은 100입니다.
min와 max 속성을 이용하면 범위의 최솟값과 최댓값을 변경할 수 있습니다.
<div class="container mt-3">
<h3>레인지(range)</h3>
<form>
<label for="range1" class="form-label">나이 대를 선택해 주세요.</label>
<input type="range" class="form-range" id="range1" min="10" max="60" step="10" name="rang" value="20">
<button type="submit" class="btn btn-primary mt-3">확인</button>
</form>
</div>
ex5-10.html의 실행 결과
