폼

HTML 폼은 사용자로부터 데이터를 입력받아 서버로 전송하는 데 사용됩니다. 다양한 종류의 입력 요소와 함께 사용하여 다양한 형태의 폼을 만들 수 있습니다.

form

폼 전체를 감싸는 태그입니다.

<form action="submit.php" method="post">
</form>

action: 폼 데이터를 전송할 서버 측 스크립트의 URL을 지정합니다.
method: 데이터를 전송하는 방법을 지정합니다 (get 또는 post).

input

사용자 입력을 받는 다양한 종류의 입력 요소를 생성합니다.

<input type="text" name="username" placeholder="사용자 이름">
<input type="password" name="password">
<input type="email" name="email">
<input type="submit" value="제출">

type: 입력 필드의 종류를 지정합니다.
- text: 일반적인 텍스트 입력 (예: 이름, 이메일)
- password: 비밀번호 입력 (입력된 내용이 가려짐)
- email: 이메일 형식의 입력만 허용
- number: 숫자만 입력 가능
- date: 날짜 선택
- time: 시간 선택
- datetime-local: 날짜와 시간 선택
- search: 검색창
- url: URL 입력
- tel: 전화번호 입력
- checkbox : 체크박스
- radio : 라디오버튼
- file : 파일 업로드
name: 서버로 전송될 때 사용될 변수명을 지정합니다.
required 속성: 필수 입력 항목을 지정할 수 있습니다.
disabled: 입력을 비활성화
readonly: 입력 내용을 읽기 전용으로 설정
maxlength: 입력 가능한 최대 글자 수 지정
minlength: 입력 가능한 최소 글자 수 지정
pattern 속성: 입력 값의 형식을 제한할 수 있습니다.
placeholder 속성: 입력 필드에 미리 보여줄 텍스트를 설정할 수 있습니다.

label

입력 요소에 대한 설명을 제공합니다.

<label for="username">사용자 이름:</label>
<input type="text" id="username" name="username">

for 속성: 관련 input 요소의 id를 지정합니다.

textarea

여러 줄의 텍스트를 입력받을 수 있는 영역을 생성합니다.

<textarea name="message" rows="5" cols="30"></textarea>

rows: 행의 수를 지정합니다.
cols: 열의 수를 지정합니다.

select

드롭다운 목록을 생성합니다.

<select name="country">
  <option value="korea">한국</option>
  <option value="usa">미국</option>
  <option value="japan">일본</option>
</select>

option

<select> 태그 안에서 선택할 수 있는 옵션을 정의합니다.

button

버튼을 생성합니다.

<button type="submit">제출</button>
<button type="reset">초기화</button>

type: 버튼의 종류를 지정합니다.
- submit
- reset
- button

fieldset

관련된 입력 요소들을 그룹화합니다.

<fieldset>
  <legend>개인 정보</legend>
  <input type="text" name="name">
  <input type="email" name="email">
</fieldset>

legend

<fieldset> 그룹에 대한 설명을 제공합니다.

3.0 KiB Raw Blame History

폼