표 만들기 - TABLE

TABLE - 표 만들기. 홈페이지의 레이아웃을 완성

표는 줄(row)과 칸(column), 셀(cell)로 이루어진다.


1.표를 만드는 <TABLE> 태그 입력
<TABLE>

</TABLE>

2.줄을 먼저 만든다. 2줄일 경우 <TR>태그와 </TR>태그 두 쌍을 넣는다.

<TABLE>
    <TR>
    </TR>
    <TR>
    </TR>
</TABLE>

3.칸이 3개면 각 줄마다 칸을 3개씩 넣는다. <TR>안에 <TD>와 </TD>를 세 쌍씩 삽입

<TABLE>
    <TR>
        <TD></TD>
        <TD></TD>
        <TD></TD>
    </TR>
    <TR>
        <TD></TD>
        <TD></TD>
        <TD></TD>
    </TR>
</TABLE>


4.테두리 선이 보이게 하려면 <TABLE BORDER="1">로 해준다.



<TABLE> 태그 안에 사용하는 태그들

CAPTION : 표에 제목이나 설명 적음
TR : 표의 한 줄 지정
TD : 표의 한 칸 지정
TH : 제목이 들어갈 칸 만들 때 사용
COL : 여러줄에 걸친 칸 하나 지정
COLGROUP : 여러 COL요소를 하나의 그룹으로 묶음. SPAN속성을 사용해서 며책의 칸을 하나로 묶을지 지정
THEAD : 여러줄을 하나의 그룹으로 묶어 표의 머리글로 지정
TBODY : 여러줄을 그룹으로 묶어 표의 본문으로 지정
TFOOT : 여러줄을 그룹으로 묶어 표의 꼬리말로 지정. <TFOOT>은 <TBODY>보다 먼저 와야 한다.


예)
<TABLE BOLDER="1">
<THEAD>
<TR>
    <TD>&nbsp;</TD>
    <TD>년자료</TD>
</TR>
</THEAD>
<TFOOT>
<TR>
    <TD COLSPAN="2">출처:STAT-KOREA</TD>
</TR>
</TFOOT>
<TR>
    <TD>&nbsp; &nbsp;1995 &nbsp; &nbsp;</TD>
    <TD>1,641,293</TD>
</TR>
<TR>
    <TD>&nbsp; &nbsp;1996 &nbsp; &nbsp;</TD>
    <TD>3,180,989 </TD>
</TR>
</TABLE>




<COL>태그와 <COLGROUP> 태그는 <TR>과 <TD> 전, 즉 <TABLE> 바로 밑에 사용.
한 칸의 셀들에 대해서 사용할 때는 <COL>태그 사용, 인접한 여러 칸 묶을 때는 <COLGROUP> 사용.


예)칸이 다섯개인 표에서...
<TABLE>
<COL WIDTH="100" ALIGN="left"> //이 칸은 모두 너비를 100px로, 왼쪽정렬
<COLGROUP SPAN="2" ALIGN="center"> //두개 칸 모두 똑같이 정렬을 가운데로
<COL>//따로 속성지정x인 칸들도 <COL>태그를 이용해서 칸의개수를 맞춰야 한다.
<COL>
<TR>
    <TD> ...</TD> <TD>...</TD> <TD> ...</TD> <TD>...</TD><TD> ...</TD>
</TR>
<TR>
    <TD> ...</TD> <TD>...</TD> <TD> ...</TD> <TD>...</TD><TD> ...</TD>
</TR>
</TABLE>