TH, TD
 
TABLE로 표의 시작과 끝을 알리고, TR로 행을 결정한 다음에는 각 행에 들어갈 셀을 만들어 준다. 이 때는 테이블에 들어가는 데이터라는 뜻으로 TD(table data)를 셀의 수만큼 만들어준다. 각 셀의 내용은 TD 안에 써 준다. TD는 시작 태그만 써 주면 된다.

간단한 예를 먼저 보자.

<TABLE width = 80% border=1 cellpadding=5>
<TR align = center>
    <TD>1행 1번 셀
    <TD>1행 2번 셀
<TR>
    <TD>2행 1번 셀
    <TD>2행 2번 셀
</TABLE>

+ 실행결과

1행 1번 셀 1행 2번 셀
2행 1번 셀 2행 2번 셀


셀 중에서 한 행이나 열의 제목이 되는 셀은 TD 대신 TH(table header) element를 사용한다. TD와 TH는 모든 면에서 동일하지만 TH는 기본적으로 굵은 글씨로 나오고, 가로 정렬이 중앙이라는 점이 다르다.

<TABLE width = 80% border=1 cellpadding=5>
<TR>
    <TH>오늘의 온도
    <TH>오늘의 습도
<TR align = right>
    <TD>24도
    <TD>60%
</TABLE>

+ 실행결과

오늘의 온도 오늘의 습도
24도 60%




TR의 경우, align과 valign 속성은 한 행 전체에 적용이 되지만, TH와 TD에서는 해당 셀에만 적용된다.

셀 합치기

HTML의 표에서는 셀 분할은 없고, 병합만이 있다. 따라서, 합치기 전 상태의 표를 염두에 두고 행과 셀의 수를 따진 다음, 가로로 합칠 것인지, 세로로 합칠 것인지를 결정한다.

colspan = 숫자

두 개 이상의 셀을 가로 방향(열 병합)으로 합치려고 할 때는 colspan 속성을 넣어주고, 합치려고 하는 셀의 수만큼 숫자를 써 준다.

rowspan = 숫자

두 개 이상의 셀을 세로 방향(행 병합)으로 합치려고 할 때는 rowspan 속성을 넣어주고, 합치려고 하는 셀의 수만큼 숫자를 써 준다.

<TABLE border width = 80%>
<TR>
    <TD>1행 1번 셀
    <TD>1행 2번 셀
<TR>
    <TD colspan = 2>2행 1번 셀
</TABLE>
<P>
<TABLE border width = 80%>
<TR>
    <TD rowspan = 2>1행 1번 셀
    <TD>1행 2번 셀
<TR>
    <TD>2행 1번 셀
</TABLE>

+ 실행결과

1행 1번 셀 1행 2번 셀
2행 1번 셀

1행 1번 셀 1행 2번 셀
2행 1번 셀