HTML 태그 - 코딩의 시작, TCP School

Home » What Is Th In Html » HTML 태그 - 코딩의 시작, TCP School

Maybe your like

HTML <th> 태그

정의 및 특징

<th> 태그는 HTML 테이블에서 제목이 되는 헤더 셀(header 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>

코딩연습 ▶

지원하는 브라우저 및 버전

태그명

chrome

edge

ie

firefox

safari

opera
<th> 1.0 지원함 지원함 1.0 지원함 지원함

HTML5에서 변경된 사항

HTML5에서는 다음과 같은 <th> 태그의 모든 레이아웃 관련 속성을 더 이상 지원하지 않습니다.

- align, axis, bgcolor, char, charoff, height, nowrap, valign, width

사용할 수 있는 속성

속성명 속성값 설명

abbr

텍스트

헤더 셀 내부의 콘텐츠에 대한 짧은 설명을 명시함.

align

left

center

right

justify

char

헤더 셀 내부의 콘텐츠에 대한 정렬 방법을 명시함.

HTML5에서는 더 이상 지원하지 않음.

axis

카테고리명

헤더 셀이 포함될 카테고리를 명시함.

HTML5에서는 더 이상 지원하지 않음.

bgcolor

rgb(x,x,x)

#xxxxxx

색상명

헤더 셀의 배경색을 명시함.

HTML5에서는 더 이상 지원하지 않음.

char

문자

헤더 셀 내부의 콘텐츠를 정렬할 때 기준이 되는 문자를 명시함.

HTML5에서는 더 이상 지원하지 않음.

charoff

숫자

헤더 셀 내부의 콘텐츠 중에서 char 속성에 명시된 문자를 기준으로 정렬될 문자수를 명시함.

HTML5에서는 더 이상 지원하지 않음.

colspan

숫자

해당 헤더 셀이 확장될 열(column)의 개수를 명시함.

headers

header id

해당 헤더 셀과 연관된 하나 이상의 헤더 셀(header cell)을 명시함.

height

픽셀

%

헤더 셀의 높이를 명시함.

HTML5에서는 더 이상 지원하지 않음.

nowrap

nowrap

헤더 셀 내부의 콘텐츠가 자동으로 다음 행으로 넘어가지 않음을 명시함.

HTML5에서는 더 이상 지원하지 않음.

rowspan

숫자

해당 헤더 셀(cell)이 확장될 행(row)의 개수를 명시함.

scope

col

colgroup

row

rowgroup

테이블에서 헤더 셀과 데이터 셀을 연결하는 방법을 명시함.

sorted

reversed

숫자

reversed 숫자

숫자 reversed

열(column)이 정렬되는 방향을 명시함.

valign

top

middle

bottom

baseline

헤더 셀 내부의 콘텐츠에 대한 수직 방향의 정렬 방법을 명시함.

HTML5에서는 더 이상 지원하지 않음.

width

픽셀

%

헤더 셀의 너비를 명시함.

HTML5에서는 더 이상 지원하지 않음.

CSS 기본값

th {

display: table-cell;

vertical-align: inherit;

font-weight: bold;

text-align: center;

}

DOM 인터페이스

interface HTMLTableHeaderCellElement : HTMLTableCellElement {

attribute DOMString scope;

attribute DOMString abbr;

};

연관 페이지

HTML 테이블 수업 ⇒

CSS 테이블 수업 ⇒

연습문제

  • 연습문제1
  • 연습문제2
  • 연습문제3
  • 연습문제4
  • 연습문제5

Tag » What Is Th In Html