FORM 태그의 구성 및 사용법

HTML 내에서 사용자와의 상호작용을 통하여 사용자가 어떤 내용을 원하는지, 사용자의 요구사항은 무엇인지를 파악할때 가장 많이 사용하는 것이 바로 FORM 입니다. HTML에서는 Form을 사용해서 여러가지 파라메터 값을 하나로 묶어서 사용할 수 있습니다. From 태그는 단독으로 쓰여지지 않고 From 태그 안에 여러가지 파라메터 값을 입력하여 사용합니다.

Form 태그 형식

<FORM NAME=" " TARGET=" " ACTION=" " HETHOD=" " ENCTYPE=" " onReset=" " onSubmit=" ">  파라메터 </FORM>

FORM의 구성 요소

    ● NAME : Form의 이름을 나타냅니다.

    ● ACTION : <FORM></FORM> 안의 파라메터를 전송할 곳을 지정합니다.

    ● METHOD : <FORM></FORM> 안의 파라메터를 전송할때의 방식을 지정합니다.(GET/POST)

    ● TARGET : 폼에서 보내주는 응답의 실행프레임을 결정하는 속성입니다.

1. INPUT 파라메터

INPUT 타입을 변화시켜서 원하는 형태의 출력결과를 얻을 수 있습니다.

태그모양			태그형식	출력결과
버튼			<input type="button" value="버튼">
체크박스			<input type="checkbox" >사과  <input type="checkbox">수박	사과 수박
숨겨진 입력 양식			<input type="hidden">
파일 업로드			<input type="file">
이미지			<input type="image">
암호			<input type="password">
라디오 버튼			<input type="radio" name="sex">남자   <input type="radio" name="sex">여자	남자 여자
리셋버튼			<input type="reset" value="Clear">
서브미트			<input type="submit" value="전송">
텍스트			<input type="text">

2. TEXTAREA 파라메터

TEXTAREA 상자안에 원하는 문장을 입력할 수 있습니다.
TEXTAREA의 WRAP 속성은 기본적으로 off 되어 있지만, soft/hard 로 적용할 수 있습니다.
WRAP="off"  : 엔터없이 문장을 입력할 시 수평 스크롤바가 생기고, 옆으로 계속 문장이 입력됩니다.
WRAP="soft"  : 엔터를 입력하지 않아도 텍스트라인 끝에서 자동 개행됩니다.
WRAP="hard"  : soft 상태와 비슷하며 실제 내용을 서버에 전송할때 캐리지 리턴 문자를 전달합니다.

태그형식	출력결과
<textarea cols="15" rows="4"> 팡상닷컴 야이노마 놀러오세요!</textarea>	<span style="font-family: Gulim;">팡상닷컴 야이노마 놀러오세요!</span>

3. SELECT

SELECT 태그는 리스트상자의 목록을 선택하는 것 입니다.
<select> </select>태그 안에 <option></option> 태그를 삽입하여 원하는 목록을 추가할 수 있습니다.
multiple 속성을 추가하면 리스트 상자의 목록을 ctrl 키를 눌러 여러개를 선택할 수 있습니다.

태그형식	출력결과
<select size=5 multiple>   <option value=0 seleted>수박</option>  <option value=1>참외</option>  <option value=1>딸기</option> </select>	수박 참외 딸기
<select size=5 multiple>   <option value=0 seleted>수박</option>  <option value=1>참외</option>  <option value=1>딸기</option> </select>	수박 참외 딸기