<!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>회원가입 정보입력 예제</title>
</head>
<body>
<h1>회원가입 정보입력</h1>
<form name="join" method="POST" action="join.html">
<fieldset>
<legend>회원가입 정보입력</legend>
<table border="1" cellpadding="7px" cellspacing="0">
<tr>
<th>이름</th> <td><input type="text"></td>
</tr>
<tr>
<th>아이디</th> <td><input type="text" minlength="6" maxlength="12"> <button id="idCheck">아이디중복확인</button></td>
</tr>
<tr>
<th>비밀번호</th> <td><!-- <label for="pw1"></label> --><input type="password" id="pw1"> (공백없이 6 ~ 12자리 이내, 영문과 숫자 조합)</td>
</tr>
<tr>
<th>연락처</th> <td><select><option>010</option><option>011</option></select> - <input type="text" size="4" maxlength="4"> - <input type="text" size="4" maxlength="4"></td>
</tr>
<tr>
<th rowspan="2">집주소</th> <td><input type="text" size="6"> <button id="addr">우편번호찾기</button></td>
</tr>
<tr>
<td><input type="text" size="80"></td>
</tr>
<tr>
<th>사진</th> <td><input type="file"></td>
</tr>
<tr>
<th>회원구분</th> <td><input type="radio" name="member" id="person"> 개인회원 <input type="radio" name="member" id="enterprise"> 기업회원</td>
</tr>
<tr>
<th>메일링서비스</th> <td><input type="checkbox" id="entertain"> 연예정보 <input type="checkbox" id="culture"> 문화정보 <input type="checkbox" id="shopping"> 쇼핑정보 <input type="checkbox" id="weather"> 날씨정보</td>
</tr>
<tr>
<th>자기소개</th> <td><textarea name="intro" id="intro" cols="80" rows="5">20자 이상 적어주세요!</textarea></td>
</tr>
</table>
<p></p>
<input type="submit" id="ok" value="확인">
<input type="reset" id="cancel" value="취소">
<p></p>
</fieldset>
</form>
</body>
</html>
Engineering is the closest thing to magic that exists in the world.