Table 태그

Table

- 데이터를 담은 표를 만들 때 사용합니다.

- <table>로 시작하고, 그 안에 <tr>, <th>, <td>가 있습니다.

- 각 셀마다 헤더에 관한 셀인지(th), 데이터에 관한 셀(td)인지 구분해야 합니다.

 

tr

- 테이블 행을 의미합니다. 행이기 때문에 가로로 보여집니다.

 

th

- th의 개수에 맞게 td를 써야 합니다. (개수가 다르면 bad이므로!!)

- th가 들어있는 tr을 <thead>로 묶어주면 더 명확하게 이건 th이다 라는 의미를 브라우저에게 전달합니다.

- scope 이라는 속성을 가지고 있습니다. 가로 줄의 제목(row)인지, 세로 줄의 제목(col)인지 명확하게 나타냅니다.

  <th scope="row"> 또는 <th scope="col">

 

td

- Table의 데이터를 의미합니다.

- th 개수와 동일하게 td를 작성해야 합니다.

- td가 들어있는 tr을 <tbody>로 묶어주면 더 명확하게 이건 td이다 라는 의미를 브라우저에게 전달합니다.

 

tfoot

- 총합계, 최종결론, 요약 등을 구할 때 사용합니다.

 

---

 

rowspan

- 세로로 몇칸을 자치하는지 설정할 수 있습니다.

 

colspan

- 가로로 몇 칸을 차지하는지 설정할 수 있습니다.

 

실습 파일: Table/table.html

실습 파일: Table/google.html