HTML
HTML[HTML 폼(Form)]
developer_Michael
2023. 3. 30. 18:36
반응형
HTML 폼(form)은 사용자로부터 정보를 입력받을 수 있는 방법을 제공하는 요소입니다.
HTML 폼을 사용하면 사용자가 데이터를 입력하고 제출 버튼을 클릭하여 서버로 데이터를 전송할 수 있습니다.
폼은 입력 필드, 버튼, 레이블 등의 요소로 구성됩니다.
HTML 폼 요소의 종류:
<form>: 폼을 정의하는 요소입니다.
<input>: 사용자로부터 데이터를 입력받을 수 있는 요소입니다. type 속성을 통해 입력 필드의 종류를 지정할 수 있습니다.
<textarea>: 여러 줄의 텍스트를 입력받을 수 있는 요소입니다.
<select>: 드롭다운 목록을 생성할 수 있는 요소입니다.
<option>: 드롭다운 목록의 선택지를 정의하는 요소입니다.
<label>: 입력 필드와 레이블을 연결하는 요소입니다.
<button>: 버튼을 정의하는 요소입니다.
HTML 폼 요소는 name 속성을 사용하여 서버로 전송될 데이터의 이름을 지정할 수 있습니다.
value 속성을 사용하여 입력된 값을 지정할 수도 있습니다.
<form action="/submit-form" method="post">
<label for="username">사용자 이름:</label>
<input type="text" id="username" name="username" required>
<label for="password">비밀번호:</label>
<input type="password" id="password" name="password" required>
<label for="gender">성별:</label>
<select id="gender" name="gender">
<option value="male">남성</option>
<option value="female">여성</option>
</select>
<button type="submit">제출</button>
</form>
위 코드는 사용자 이름, 비밀번호, 성별을 입력받고 제출 버튼을 누르면
/submit-form URL로 POST 요청을 보내는 폼을 생성하는 코드입니다.
input 요소에서 required 속성을 사용하여 필수 입력 필드로 지정하였으며,
select 요소를 사용하여 드롭다운 목록을 만들었습니다. button 요소를 사용하여 제출 버튼을 만들었습니다.
반응형