반응형
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>input 요소</title>
</head>
<body>
<!--
숫자 입력 필드 type="number", type="range"
기본형 - <input type="number>
<input type="range">
속성 - min : 필드에 입력할 수 있는 최소값을 지정, 기본 최소값 0
max : 필드에 입력할 수 있는 최대값을 지정, 기본 최대값 100
step : 숫자 간격을 지정, 기본 값은 1
value : 필드에 표시할 초기값
-->
<ul>
<li>
<label><input type="checkbox" value="s_3">선물용 3kg</label>
<input type="number" min="0" max="5">개 (최대 5개)
</li>
<li>
<label><input type="checkbox" value="s_5">선물용 5kg</label>
<input type="range" min="0" max="5">개 (최대 5개)
</li>
</ul>
<!--
날짜 입력 type="date", type="month", type="week"
-->
<h1>날짜 지정하기</h1>
<input type="date">
<input type="month">
<input type="week">
<h1>시간 지정하기</h1>
<input type="time">
<input type="datetime">
<input type="datetime-local">
</body>
</html>
반응형
'IT > HTML' 카테고리의 다른 글
| HTML 3일차 - table 태그 (0) | 2023.05.09 |
|---|---|
| HTML 3일차 - form 태그 (0) | 2023.05.09 |
| HTML 2일차 - 하이퍼링크(a) (0) | 2023.05.09 |
| HTML 2일차 - 미디어태그(audio, video) (0) | 2023.05.09 |
| HTML 2일차 - 미디어태그(object, embed) (0) | 2023.05.09 |