테이블 태그에 대한 심층적 인 이해

저자：Eve Cole 업데이트 시간：2025-05-27 11:00:04

테이블은 오랫동안 사용되었으며 오늘날에도 여전히 사용되는 태그입니다. 그러나 현재 웹 사이트의 리팩토링으로 인해 레이아웃 테이블이 아닌 것이 좋습니다. 많은 친구들이 테이블을 사용하는 것이 소위 비표준이라고 잘못 생각합니다. 실제로는 그렇지 않습니다. 테이블은 중요한 요소입니다.

얼마 전, 나는 테이블에 포함 된 주요 태그를 찾고있었습니다. 물론, 나는 그들이 당신과 공유하는 것을 발견했습니다.

테이블 태그의 주요 태그에는 테이블, 캡션, TH, TR, TD, 헤드, TFOOT, TBODY, COL 및 COLGROUP가 포함됩니다. 각각의 소개는 다음과 같습니다.

<테이블>

테이블 태그는 테이블을 정의합니다. <pable> 태그 내부에는 테이블의 제목, 테이블 행, 테이블 열, 테이블 셀 및 기타 테이블을 배치 할 수 있습니다.

<캡션>

캡션 요소는 테이블 제목을 정의합니다. 캡션 태그에 즉시 테이블 태그가 있어야합니다. 각 테이블에 대해 하나의 제목 만 정의 할 수 있습니다. 일반적 으로이 제목은 테이블을 중심으로합니다.

<th>

테이블 내에서 헤더 셀을 정의합니다. 이 요소 내부의 텍스트는 일반적으로 굵게 표시됩니다.

<tr>

테이블에서 행을 정의하십시오.

<td>

테이블에서 셀을 정의하십시오.

<헤드>

테이블 헤더를 정의합니다.

Thead, Tfoot 및 Tbody 요소는 테이블에서 행을 그룹화 할 수있는 기능을 제공합니다. 테이블을 만들 때 헤더 행, 데이터가있는 행, 하단에 총 행이 필요할 수 있습니다. 이 부서를 사용하면 브라우저가 테이블 제목 및 바닥 글과 독립적 인 테이블 본체 스크롤을 지원할 수 있습니다. 긴 테이블이 인쇄되면 테이블 데이터가 포함 된 각 페이지에서 테이블 헤더와 바닥 글을 인쇄 할 수 있습니다.

<tbody>

테이블의 본문 (텍스트)을 정의합니다.

<tbody> 태그를 사용하여 테이블을 별도의 섹션으로 나눌 수 있습니다. <tbody> 태그는 테이블의 하나 또는 여러 행을 그룹으로 결합 할 수 있습니다.

테이블에 하나 이상의 <tbody> 태그를 포함 시키려고 할 수도 있지만 테이블에 <tbody> 태그가없는 것이 좋습니다.

<tbody> 태그에서 <tr> 태그 만 테이블 행을 정의 할 수 있습니다. 일단 정의되면 <tbody> 태그는 테이블의 독립적 인 부분입니다. 예를 들어, <TBody>에서 다른 <TBody>까지 스팬을 가질 수 없습니다.

<tfoot>

테이블의 바닥 글을 정의합니다 (각주).

<col>

테이블에서 하나 이상의 열의 속성 값을 정의합니다. 이 속성은 테이블 또는 콜 그룹에서만 사용할 수 있습니다.

테이블 열의 그룹화를 정의합니다. 이 요소를 사용하면 포맷을 위해 열을 결합 할 수 있습니다. 이 요소는 <pable> 태그 내에서만 합법적입니다.

<colgroup> 태그를 사용하는 두 가지 방법이 있습니다. 하나는 몇 가지 동일한 열을 간단히 정의하고 다른 하나는 여러 다른 열을 결합하는 것입니다.