HTML form

<!-- 입력폼 만들때 사용   필수속성: action(어디로?), method(어떻게?) -->

   

   <form action='#' method="get">

       <!-- input의 속성

          1. 입력한 값을 구분하기 위해 이름 지정

          2. placeholder : 미리보기 텍스트

          3. autofocus : 자동커서 설정

          4. value: 기본 값 지정

          5. readonly : 읽기 전용 지정

          6. maxlength : 글자수 제한

         -->

        아이디: <input type = "text" name = "userID" placeholder="아이디를

        입력하시오" autofocus>

       

        <br>

        비밀번호 : <input tpye ="password" name="userPW" maxlength="10">

        <br>

        주소: <input type = "text" name="userAdd" value="2교육실" readonly>

 <br><br>

 <!-- 사용자에게 선택을 받아보자 3가지 -->

 <!-- ★★★ check 와 radio의 필수속성

      : name, value -->

 <!-- 1. checkbox -->

 <p>좋아하느 커피를 모두 골라주세요</p>

 아메리카노<input type="checkbox" name="coffee" value="ame">

 카페라떼<input type = "checkbox" name="coffee" value="latte">

 <!-- 2. radio -->

 <br><br>

 <p>성별을 골라주세요</p>

 남성<input type = "radio" name="gender" value="man">

 여성<input type = "radio" name="gender" value="woman">

 <!-- 3. select태그 (input의 type이 아닌, 독자적인 태그) -->

 <br><br>

 <select>

     <option value="naver">네이버</option>

     <option value="daum">다음</option>

     <option valuy="google">구글</option>

 </select>

<!-- 가볍게 볼 것 -->

<br><br>

<input type="file">

<br>

<input type="color">

<br>

<input type="number">

<br>

<input type="range">

<br>

<input type="date">

<br>

<input type="datetime-local">

<!-- 제출 및 초기화★

제출 & 초기화 되는 정보는 form태그 시작~끝

위치는 무조건 form태그 안에 -->

<br><br>

<input type="submit" value="보내기">

<input type="reset" value="다시쓰기">