다양한 input 타입

imjingu·2024년 1월 2일
htmlinput
0

개발공부

목록 보기
475/481
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <label>email</label>
        <!-- type= "tel"
        전화번호를 입력할 수 있는 필드. 모바일에서는 숫자 키보드로 자동 전환-->
    <label>tel
        <input type="tel" name="tel"/>
    </label>

    <!-- type="number"
    숫자 생성 양식 min은 ~부터라는 의미, max는 ~까지하는 의미, step는 클릭할때 값
    모바일에서는 숫자 키보드로 자동전환-->
    <label>number
        <!-- 형식은 1부터 100까지이고 버튼 클릭시 값은 5씩 변경-->
        <input type="number" name="number" min="1" max="100" step="5"/>
    </label>

    <!-- type="range"
    슬라이더 막대를 움직여 값을 입력, value 는 초기값-->
    <label>range
        <!-- 형식은 1부터 100까지이고 버튼 클릭시 값은 5씩 변경-->
        <input type="range" name="range" min="1" max="5" value="3"/>
    </label>

    <!-- type="time"
    시간을 지정 -->
    <label>time
        <input type="time" name="time"/>
    </label>

    <!-- type="datetime"
    날자 시간을 지정-->
    <label>datetime
        <input type="datetime-local" name="datetime-local"/>
    </label>

    <input type="reset" />
    <input type="submit" />
</body>
</html>

profile
imjingu
이전 포스트

약관동의

다음 포스트

회원가입

0개의 댓글