[HTML] Form

1. <form> 태그 기본 개요

<form> 태그는 HTML 문서 내에서 폼을 정의하는 기본 태그입니다. <form> 태그는 웹 서버와 데이터를 주고받기 위한 틀을 제공하며, action 속성으로 데이터를 전송할 URL을, method 속성으로 전송 방식을 지정할 수 있습니다.

• action: 폼 데이터를 전송할 URL을 지정합니다.
• method: 전송 방식을 설정합니다. 일반적으로 GET이나 POST 방식이 사용됩니다.

2. 입력 필드 (<input> 태그)

<input> 태그는 다양한 형태의 입력 필드를 제공합니다. 이 태그는 type 속성에 따라 다른 기능을 갖게 되며, 사용자로부터 텍스트, 숫자, 날짜, 파일 등 여러 유형의 데이터를 입력받을 수 있습니다.

2-1 텍스트 입력 관련

• 일반 텍스트 (type="text")
• 비밀번호 (type="password")
• 이메일 (type="email")
• URL (type="url")
• 전화번호 (type="tel")

2-2 여러 줄 입력 (<textarea> 태그)

• 여러 줄의 텍스트를 입력받는 필드로, 주로 긴 설명이나 메모를 작성할 때 사용됩니다.
• rows와 cols 속성으로 세로, 가로 크기를 설정할 수 있으며, placeholder 속성으로 안내 문구를 표시할 수 있습니다.

2-3 숫자 및 범위 관련

• 숫자 입력 (type="number")
• 범위 선택 (type="range")

2-4 날짜와 시간 입력

• 날짜 (type="date")
• 시간 (type="time")
• 날짜와 시간 (type="datetime-local")

2-5 파일 및 색상 선택

• 파일 업로드 (type="file")
• 색상 선택 (type="color")

2-6 기타 선택 항목

• 체크박스 (type="checkbox")
• 라디오 버튼 (type="radio")
• 드롭다운 목록 (<select> 태그)

3. 폼 전송 및 조작 버튼

• 제출 버튼 (type="submit")
• 리셋 버튼 (type="reset")
• 일반 버튼 (type="button")

4. 숨김 필드 (type="hidden")

• 화면에 표시되지 않지만 폼 데이터를 전송할 때 서버로 특정 값을 전달하기 위해 사용됩니다.
• 예를 들어, 사용자 ID, 토큰 등을 숨겨진 상태로 폼에 포함할 수 있습니다.

---

>>추가 속성들

• required: 필수 입력 필드로 지정하여 값이 입력되지 않으면 폼이 제출되지 않도록 설정합니다.
• pattern: 정규 표현식을 사용해 입력 값의 형식을 제한합니다.
• placeholder: 입력 필드에 안내 문구를 표시하여 사용자가 입력할 내용에 대한 힌트를 제공합니다.
• min, max, step: 숫자 및 범위와 관련된 필드에서 입력 가능 범위를 지정합니다.