로그인  회원가입  
인포앤북 홈

6-1. <table> 태그

■ 테이블 삽입 : <table> <tr> <th> <td>

다음은 지역별 최고 기온을 테이블로 만드는 예시입니다.

테이블 만들기
ex6-1.html
<h3>지역별 최고 기온</h3>
<table border="1">
<tr><th>지역</th> <th>내일</th> <th>모레</th></tr>
<tr><td>서울</td> <td>15</td> <td>13</td></tr>
<tr><td>부산</td> <td>18</td> <td>16</td></tr>
<tr><td>대전</td> <td>16</td> <td>14</td></tr>
</table>
ex6-1.html의 실행 결과
■ 회원 가입 폼 양식 만들기

폼 양식과 테이블 태그들을 이용하여 회원 가입 폼 양식을 만드는 다음의 예제를 살펴봅시다.

회원 가입 폼 양식
ex6-2.html
<h3>회원 가입</h3>
<form>
<table>
<tr><td>아이디</td> <td><input type="text"></td></tr>
<tr><td>이름</td> <td><input type="text"></td></tr>
<tr><td>비밀번호</td> <td><input type="password"></td></tr>
<tr><td>비밀번호 확인</td> <td><input type="password"></td></tr>
<tr>
<td>전화번호</td> 
<td><input type="text" placeholder="010-123-4567"></td>
</tr>
<tr>
<td>이메일</td> 
<td>
<input type="text">@
<select>
<option>직접입력</option>
<option>naver.com</option>
<option>gmail.com</option>
<option>hanmail.net</option>
</select>
</td>
</tr>
<tr>
<td>문자수신 여부</td> 
<td>
<input type="radio" name="message" checked> 예
<input type="radio" name="message"> 아니오
</td>
</tr>
<tr>
<td>가입 경로</td> 
<td>
<input type="checkbox" name="item1"> 친구 소개
<input type="checkbox" name="item2"> 인터넷 검색
<input type="checkbox" name="item3"> 블로그 
<input type="checkbox" name="item4"> 기타
</td>
</tr>
        <tr><td colspan="2"><button type="submit">저장</button></td></tr>
</table>
</form>
ex6-2.html의 실행 결과