<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HTML5 input 태그</title> </head> <body> <h2>HTML input</h2> <br> <form action="#"> <fieldset> <legend>color</legend> <label for="my-color"> 색상 선택 </label> <input type="color" id="my-color" name="myColor"> </fieldset> <fieldset> <legend>date</legend> <label for="my-date">날짜 선택(년월일)</label> <input type="date" id="my-date" name="myDate"> </fieldset> <fieldset> <legend>month</legend> <label for="my-month">월 선택(년월)</label> <input type="month" id="my-month" name="myMonth"> </fieldset> <fieldset> <legend>week</legend> <label for="my-week">주 선택(년도,주)</label> <input type="week" id="my-week" name="myWeek"> </fieldset> <fieldset> <legend>time</legend> <label for="my-time">시간 설정</label> <input type="time" id="my-time" name="myTime"> </fieldset> <fieldset> <legend>range</legend> <label for="point">값 선택</label> <input type="range" id="point" name="point" min="0" max="100" step="10" value="10"> <pre> 슬라이더를 사용해서 값을 선택. min, max : 범위 지정 step : 숫자 간격 조정 value : 초기값 설정 </pre> </fieldset> <fieldset> <legend>number</legend> <label for="count"></label> <input type="number" id="count" name="point" min="0" max="10" step="2" value="0"> </fieldset> </form> </body> </html>