Form (1)

<form> : 사용자가 정보를 입력하여 제출할 수 있도록 함

    속성

    action : form을 어디로 보낼지 결정(필수속성!) / 해당 데이터를 처리할 웹 서버 URL

    method : form을 어떻게 보낼지 결정(필수속성!) / get or post

       ㄴ get : 해당 데이터를 숨김 없이 보냄(=엽서), 짧을 때

       ㄴ post : 해당 데이터를 body에 숨겨서 보냄(=편지), 길 때

 

<input> : 사용자가 정보를 입력하기 위한 필드를 추가/빈 요소

    속성

    type : 어떤 값을 입력할 것인지를 결정하는 속성

    ㄴtext : 단일 행의 텍스트 입력 박스

    ㄴpassword : 단일 행의 검열 텍스트 입력 박스

    ㄴnumber : 단일 행의 숫자 입력 박스

    ㄴemail : 이메일 박스

    ㄴtel : 전화번호 박스

    ㄴrange : 숫자의 범위를 선택하는 슬라이더 박스

    ㄴcheckbox : 체크박스(다중선택), 필수속성-name(같은 그룹임을 알려줘야 함)

    ㄴradio : 동글이 버튼(하나만 선택), 필수속성-name, value

    ㄴfile : 파일 업로드

            multiple 속성을 쓰면 여러 파일을 동시에 업로드 가능

            accept 속성을 쓰면 내가 허용할 파일의 확장자를 지정 (.png, .jpg                image/*=모두 허용)

 

    name : key(키) / 연관되어있음을 표시하는 것 / 유사한 그룹으로 묶음

    value : 입력받은 데이터 값 / 서버가 구분할 수 있게 다른 값을 지정해야함

    placeholder : '아이디를 입력하세요'와 같은 안내 문구 작성

    label : 이름표 역할 <label for="input의 id와 같은 속성">

 

<select> : option과 함께 쓰이며 드롭다운박스 형식

      ㄴname은 필수속성

      ㄴoption은 value가 필수

 

<textarea> : 더 큰 텍스트 입력 박스, 요소안에 내용 입력 시 그대로 출력됨

<button> : 버튼, type속성을 써야하며 값으로는 button/submit/reset이 있다. disabled를 쓰면 클릭할 수 없게 바뀜