테이블 테그 속성

html505_04



학습안내

HTML 테이블

표테그

table

table 테그를 이용하여 웹테이블을 생성합니다.

<table>
</table>

속성

table테그에 속성을 추가하여 border 나 여백을 줄 수 있습니다. 하지만 이는 웹표준이 아닙니다. 단순히 사용을 할 수 있다는 권고안 일 뿐입니다.

  • border : 테이블이 갖고 있는 테이블과 셀 모두 선을 표시한다. 웹표준x
  • width : 테이블의 가로 너비를 설정한다. 웹표준x
  • cellpadding : 셀의 안쪽 여백으로써, 셀과 콘덴츠와의 간격을 조절함. 웹표준x
  • cellspacing : 셀의 바깥쪽 여백으로써, 셀과 셀간의 간격을 조절함. 웹표준x

속성을 이용하는 것보다는 CSS 를 이용하여 border나 여백등을 추가하 주는 것이 좋습니다.

행과 열

tr : 행

tr 태그는 table row를 의미합니다.

td / th: 열

th는 표에서 제목영역의 셀을 의미합니다.

표 그룹 영역

thead

표의 제 영역을 묽는 그룹 테그 입니다.

tbody

표의 일반적인 데이터를 묶는 그룹 태그

기본적으로 행그룹테그를 사용하지 않으면 크롬 브라우저가 자동으로 tbody 태그로 묶어준다.

tfoot

표의 하단 영역을 묽는 그룹 테그 입니다.

셀 그룹

colgroup

열의 그룹으로 묶을 수 있도록 해주는 테그입니다.

<colgroup>
    <col></col>
    <col></col>
    <col></col>
    <col></col>
    <col></col>
</colgroup>

colgroup을 이용하여 하위에 있는 열의 속성을 일괄적으로 적용이 가능합니다.

col

span 속성을 이용하여 열을 그룹으로 묶을지 설정한다.

<col span="3"> 
3개의 열을 그룹으로 묶습니다.
</col>

caption

표의 제목이나 설명을 출력합니다.