<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
span {
color: red;
}
th {
text-align: left;
}
</style>
</head>
<body>
<h1>사람 정보 입력</h1>
<form action="https://www.naver.com/" method="get">
<table>
<tr>
<th><label for="name"><span>*</span>이름</label></th>
<td><input type="text" id="name" name="name" value="" required></td>
</tr>
<tr>
<th><label for="passwd"><span>*</span>비밀번호</label></th>
<td><input type="password" id="passwd" name="passwd" value="" placeholder="4자 이상 입력" required></td>
</tr>
<tr>
<th><label for="phone">핸드폰번호</label></th>
<td><input type="text" id="phone" name="phone" value="" pattern="[0-9]{2,3}-[0-9]{3,4}-[0-9]{3,4}" maxlength="13"></td>
</tr>
<tr>
<th>성별</th>
<td>
<input type="radio" name="gender" value="M">남
<input type="radio" name="gender" value="F"checked>여
</td>
</tr>
<tr>
<th>취미</th>
<td><input type="checkbox" name="hobby" value="영화감상">영화감상
<input type="checkbox" name="hobby" value="독서" checked>독서
<input type="checkbox" name="hobby" value="스포츠">스포츠</td>
</tr>
<tr>
<th>지역</th>
<td>
<select name="지역">
<option value="서울">서울</option>
<option value="서울">대구</option>
<option value="서울">부산</option>
<option value="서울">광주</option>
<option value="서울">인천</option>
<option value="서울">울산</option>
</select>
</td>
</tr>
<tr>
<th colspan="2">
<input type="submit" value="저장">
<input type="reset" value="새로작성">
</th>
</tr>
</table>
</form>
</body>
</html>
'2022 SW전문인재양성사업 > 웹 퍼블리싱' 카테고리의 다른 글
HTML5 기초 (6) - 간단한 게시판 만들기 (0) | 2022.07.26 |
---|---|
HTML5 기초 (5) - 이력서 만들기 (0) | 2022.07.26 |
HTML5 기초 (3) - table 태그 2 (0) | 2022.07.26 |
HTML5 기초 (2) - table 태그 (0) | 2022.07.26 |
HTML5 기초 (1) - 각 태그와 기능 (0) | 2022.07.26 |