html input 태그와 종류를 알아보자

날짜:
  • 1. input 태그란?


    • 1. input 태그란?

    사용자로부터 값(데이터)를 입력 받기 위한 태그로, 입력받는 type 속성에 따라 입력받게 되는 데이터가 결정이 된다.



    2. input 태그의 속성

    input 테그는 아래와 같은 속성을 지정할 수 있다.

  • id:  같은 타입의 폼 요소를 구분할 때 사용한다. (예: userID, PASS등)
  • name: 전송(submit) 시 값을 구분하기 위한 키값으로 사용한다.
  • autofocus: 마우스 커서를 요소에 표시하는 태그이다.
  • required: 필수 입력값, 예를 들면 아이디 등이 있다.
  • readonly: 읽기 전용
  • placeholder: 힌트를 표시한다. (예를 들면, 'id 를 입력하세요' 등이 있다.)


    • AD


    3.Hidden 타입

    사용자가 볼 필요 없는 요소에 사용하며, 화면에는 보이지 않지만, f12계발자 도구를 사용하면 소스를 확인할 수 있다. 
    <input type= "hidden" name="hidden" value="숨기고 싶은 값">
    예시: 



    4. Text 타입

    사용자로부터 text(1줄)을 입력받을 수 있는 type 이다. 

    <input type="text" size="10" value="여기에 입력" maxlength="15">

/*
속성 지정 가능

-size: text field 길이 지정
-value: field에 표시되 내용 지정
-maxlength: field에 입력 할 수 있는 최대 문자 개수 지정
*/

    AD


    5. Password 타입

    사용자로부터 비밀번호를 입력받을 때 사용하는 타입으로,  text 타입과 달리, 입력되는 값이 '*' 로 표시된다. 

    <input type="password" name="비번">

    6. Search 타입

    사용자로부터 검색 값을 입력받기 위한 타입이다. 

    <input type="password" name="비번">


    위치: North Vancouver, BC, Canada