테이블 태그는 HTML 문서에서 가장 많이 사용되는 태그입니다.
테이블 태그에서 가장 기본적인 태그는 <table>, <tr>, <td> 이 3가지 태그입니다.
<table>태그는 테이블의 시작을 알려주는 태그입니다. 테이블의 끝은 </table>태그로 표시합니다.
<tr>태그는 table row의 약자로 행을 정의 합니다.
<td>태그는 table data의 약자로 각 행에 셀을 정의합니다. 즉 행에서 칸(열)을 나누는 기능을 합니다.
이를 이해하기 위해서 가장 간단한 1행, 1열을 가지고 있는 테이블을 만들어 보면 다음과 같습니다.
<table border="1"> <tr> <td>1*1 테이블</td> </tr> </table> |
테이블의 경계선(border)을 지정해주어야 테이블의 모양을 볼 수 있습니다.
1행에 2개의 칸(열)을 가진 테이블은 다음과 같습니다.
<table border="1"> <tr> <td>1*1 셀</td> <td>1*2 셀</td> </tr> </table> |
이번에는 행(row)을 확장하여 2*2 테이블을 만들어 보겠습니다.
<table border="1"> <tr> <td>1*1 셀</td> <td>1*2 셀</td> </tr> <tr> <td>2*1 셀</td> <td>2*2 셀</td> </tr> </table> |
테이블을 만드는 순서는 먼저 테이블을 정의하고(table), 행(tr)을 지정한 다음, 그 행을 나누어서 셀(td)을 만드는겁니다.