HTML 폼<form> 태그 사용방법 이론

SOURCE.HTML

<html>

<head>

</head>

<body>

<!--

1. 모든 입력 양식 태그는 <form>태그의 자식으로 와야한다.

2. 한페이지당 <form>태그는 일반적으로 1개, 경우 따라 2개 이상을 생성

form 속성

1. method="get or post" 의속성을 갖는다.

: form이 데이터를 서버측으로 전송할때 데이터를 보내는 방식

a. get

- 전송하는 데이터를 URL에 포함시켜서 전송

- 보안에 취약(데이터가 그대로 히스토리에 보존)

- URL 256자이내..데이터가 손실

b. post

- 전송하는 본문에 포함

- 보안에 안정적(URL 표현X)

- 길이에 제한 없음

2. action="데이터를 받아서 처리할 프로그램의 위치

데이터 전송 시 규칙

1. 입력 컨트롤은 <form>안에 있어야 함.

2. 입력 컨트롤은 name 속성값을 가져야 함.

-->

<br/>

<br />

<!--

align : 수평정렬(horizton align) 왼쪽, 오른쪽

- left | center | right

valign : 수직정렬(vertical align) 위, 아래

- top | middle | bottom

-->

<!--

텍스트박스

size : 텍스트박스의 출력 길이, 문자의 갯수

maxlength : 최대 입력 받을 수있는 문자의 수, 데이타베이스에 문자를 받을때 길이가 넘게 되면 에러가 나온다.

기본적으로 텍스트 입력 받을수 있는것이 32567

value:현재 컨트롤의 가지고 있는 데이타

readonly : 플래그타입의 속성

disabled : 커서자체도 가지 않는다. 익스에선 커서자체도 안가지만 크롬에선 커서는 가게 되어있다.

-->

1. 텍스트 박스 : <input type="text" size="10" maxlength="10" value="데이터" readonly="readonly" disabled="disabled" />

<hr />

2. 패스워드 박스 : <input type="password" />

<hr />

3. 멀티 텍스트 박스 : 단독태그가 아니다.

<!--

cols : colums의 약자 사용가능한 글자수

rows : 줄단위 ex) rows="5" 5줄가능

html 영역

컨트롤 영역, textarea영역의 경우는 그안에 글을 기재할경우 탭 엔터 등 모든게 동일하게 적용된다.

-->

<textarea cols="30" rows="5">하나

둘

셋

</textarea>

<hr />

<!--

체크 박스-> 단일선택 가능, 다중선택 가능

1개 : on/off

2개 이상 : 선택

-->

4. 체크 박스

<hr />

<!--

반드시 2개 이상 그룹을 지어 사용

-> 그룹내의 단 1개의 버튼만 선택가능 !!!

-> 단일 선택 가능

-->

5. 라디오 버튼

<hr />

</form>

</body>

</html>

소스

HTML 폼<form> 태그 사용방법 이론