[HTML] 표 그리기

테이블의 기본 형태는
<table> <tr> <td> </td> </tr> </table>
로 되어 있습니다.

- <tr></tr> : 행(세로줄)을 뜻합니다. 행의 수만큼 만들어 주시면 됩니다.
- <td></td> : <tr></tr> 사이에 사용하며, 열(가로줄)을 뜻합니다. 열의 수만큼 만들어 주시면 됩니다.
단, 병합된 셀 등이 존재할 경우, 해당 셀이 차지하는 범위를 나타내 주어야 합니다.

예시) <td colspan="2"> 가로로 2 열을 차지하는 셀이라는 뜻
　　  <td rowspan="2"> 세로로 2 행을 차지하는 셀이라는 뜻

1번셀

2번셀

3번셀

뭐, 위 그림과 같이 단순히 가로 3칸을 만드는 것이라면,

<table>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>

와 같은 식으로도 가능 합니다.


다만, 위와 같이 하게 되면 테두리가 상당히 보기 싫게 나오죠.

그래서.. <table> 에 추가적으로 설정을 해 주어야 합니다.
스타일을 적용하든... 테두리 두께를 0으로 만들어 버리든...

가령,

1번셀

2번셀

3번셀

이런 식으로 말이죠.


위 테이블의 소스는 아래와 같습니다.
<table width=300 border=0>
<tr>
<td align="center">1번셀</td>
<td align="center">2번셀</td>
<td align="center">3번셀</td>
</tr>
</table>


- border : 테두리의 굵기입니다.

- width : 테이블의 가로 넓이이고, 사용 가능한 단위는 %와 픽셀입니다.

- style : 테이블의 스타일을 지정할 수 있습니다.

- align : 해당 셀의 정렬 방법입니다. center 는 가운데 정렬이죠.

1행 1열	1행 2열
2행 1열	2행 2열
3행 1열	3행 2열

위 테이블의 소스는 다음과 같습니다.

<table border="1" width="300" style="border-collapse: collapse" bordercolor="#000000">
<tr>
<td align="center">1행 1열</td>
<td align="center">1행 2열</td>
</tr>
<tr>
<td align="center">2행 1열</td>
<td align="center">2행 2열</td>
</tr>
<tr>
<td align="center">3행 1열</td>
<td align="center">3행 2열</td>
</tr>
</table>