HTML <td> 태그
정의 및 특징
<td> 태그는 HTML 테이블에서 하나의 데이터 셀(data cell)을 정의할 때 사용합니다.
HTML 테이블를 구성하는 셀(cell)은 두 종류로 구분할 수 있으며, 하나는 <th> 요소를 사용한 헤더 정보를 저장하는 헤더 셀과 또 다른 하나는 <td> 요소를 사용한 일반적인 데이터를 저장하는 데이터 셀입니다.
<th> 요소 내의 텍스트는 기본적으로 굵은 폰트로 중앙 정렬되며, <td> 요소 내의 텍스트는 일반적인 두께의 폰트로 좌측 정렬됩니다.
colspan 속성과 rowspan 속성을 사용하면 콘텐츠를 여러 셀에 걸쳐 나타낼 수 있습니다.
예제
<table>
<tr>
<th>밥류</th>
<th>면류</th>
<th>분식류</th>
</tr>
<tr>
<td>김밥</td>
<td>라면</td>
<td>떡볶이</td>
</tr>
</table>
지원하는 브라우저 및 버전
| 태그명 |
|
|
|
|
|
|
|---|---|---|---|---|---|---|
| <td> | 1.0 | 지원함 | 지원함 | 1.0 | 지원함 | 지원함 |
HTML5에서 변경된 사항
HTML5에서는 다음과 같은 <td> 태그의 모든 레이아웃 관련 속성을 더 이상 지원하지 않습니다.
- abbr, align, axis, bgcolor, char, charoff, height, nowrap, scope, valign, width
사용할 수 있는 속성
| 속성명 | 속성값 | 설명 | |
|---|---|---|---|
| abbr | 텍스트 |
데이터 셀 내부의 콘텐츠에 대한 짧은 설명을 명시함. HTML5에서는 더 이상 지원하지 않음. |
|
|
align |
left center right justify char |
데이터 셀 내부의 콘텐츠에 대한 정렬 방법을 명시함. HTML5에서는 더 이상 지원하지 않음. |
|
| axis |
카테고리명 |
데이터 셀이 포함될 카테고리를 명시함. HTML5에서는 더 이상 지원하지 않음. |
|
|
bgcolor |
rgb(x,x,x) #xxxxxx 색상명 |
데이터 셀의 배경색을 명시함. HTML5에서는 더 이상 지원하지 않음. |
|
| char | 문자 |
데이터 셀 내부의 콘텐츠를 정렬할 때 기준이 되는 문자를 명시함. HTML5에서는 더 이상 지원하지 않음. |
|
|
charoff |
숫자 |
데이터 셀 내부의 콘텐츠 중에서 char 속성에 명시된 문자를 기준으로 정렬될 문자수를 명시함. HTML5에서는 더 이상 지원하지 않음. |
|
| 숫자 |
해당 데이터 셀(cell)이 확장될 열(column)의 개수를 명시함. |
||
| header id |
해당 데이터 셀과 연관된 하나 이상의 헤더 셀(header cell)을 명시함. |
||
| height |
픽셀 % |
데이터 셀의 높이를 명시함. HTML5에서는 더 이상 지원하지 않음. |
|
|
nowrap |
nowrap |
데이터 셀 내부의 콘텐츠가 자동으로 다음 행으로 넘어가지 않음을 명시함. HTML5에서는 더 이상 지원하지 않음. |
|
| 숫자 |
해당 데이터 셀(cell)이 확장될 행(row)의 개수를 명시함. |
||
| scope |
col colgroup row rowgroup |
테이블에서 헤더 셀과 데이터 셀을 연결하는 방법을 명시함. HTML5에서는 더 이상 지원하지 않음. |
|
|
valign |
top middle bottom baseline |
데이터 셀 내부의 콘텐츠에 대한 수직 방향의 정렬 방법을 명시함. HTML5에서는 더 이상 지원하지 않음. |
|
|
width |
픽셀 % |
데이터 셀의 너비를 명시함. HTML5에서는 더 이상 지원하지 않음. |
CSS 기본값
|
td { display: table-cell; vertical-align: inherit; } |
DOM 인터페이스
|
interface HTMLTableDataCellElement : HTMLTableCellElement {}; |
