웹 폼

웹페이지를 통해서 사용자 입력을 받는 폼을 웹 폼 이라고 한다.

이를 위한 태그들이 제공되고 있으며 폼 요소라고 부른다.

​

시멘틱 웹이 html로 만든 페이지를 구조화했다면

웹 폼은 사용자의 입력을 받는 페이지를 만드는데 사용할 수 있다.

​

---

<form>태그

​

<form action=" 폼 데이터를 처리할 웹 서버 응용 프로그램 이름 URL"

enctype="데이터 인코딩 타입"

method="폼 데이터를 웹 서버에 전송하는 방식"

name="폼 이름"

target="웹 서버 응용프로그램으로부터 전송 받은 데이터를 출력할 윈도우 이름"

​

여러가지 폼 요소들

.

.

</form>

​

※ action 속성

: submit을 누르면 연결된 url로 연결하고 폼 데이터를 같이 전송한다.

​

※ method 속성

: 폼 데이터를 어떤 방식으로 전송할지 정하는 것이다.

get과 post가 대표적이고 get은 데이터를 노출해서 전달하는 것. post는 눈에 보이지 않게 전송하는 것이다.

​

---

폼 관련 기타 태그
<label>	캡션과 폼요소들을 한 단위로 묶어서 사용가능.
<fieldset>	폼요소들을 그룹으로 묶고 외곽선 박스와 제목을 출력한다. 제목은 <legend> 태그로 표시한다.

폼 요소	설명
<input type="text">	한 줄 텍스트 입력 창
<input type="password">	암호 입력을 위한 한 줄 텍스트 입력 창(입력값 안보임)
<input type="submit">	웹 서버로 폼 데이터를 전송시키는 버튼
<input type="button">	단순 버튼
<input type="reset">	입력된 폼데이터를 초기화시키는 버튼
<input type="image">	이미지 버튼
<input type="checkbox l radio">	체크박스(네모)와 라디오버튼(원형)
<select>	드롭다운 리스트를 가진 콤보 박스
<input type= "monthlweekldateltimeldatetime-local">	년, 월, 일, 시간 등의 시간 정보 입력 창
<input type="number l range">	스핀 버튼, 슬라이드 바. 편리한 숫자 입력창
<input type="color">	컬러 다이얼로그
<input type="email l url l tel search">	이메일, url, 전화번호, 검색키워드 등 형식 검사 기능을 가진 텍스트 입력 창
<input type="file">	로컬 컴퓨터의 파일을 선택하는 폼 요소
<input type="button l reset l submit">	단순 버튼, reset, submit 버튼
<textarea>	여러 줄의 텍스트 입력 창

​