tbody 태그

tbody 태그는 테이블의 본문 부분을 정의합니다. 특정 그룹에 CSS 스타일을 한 번에 적용할 수 있도록 행을 그룹화하는 데 사용됩니다. 하나의 테이블에는 tbody 태그를 여러 개 사용할 수 있습니다.

tbody 태그는 종종 테이블의 상단, 본문, 하단을 정의하는 thead 및 tfoot 태그와 함께 사용됩니다. 기본적으로 브라우저는 tfoot의 내용을 테이블 하단에, thead의 내용을 테이블 상단에 배치합니다.

예제

tbody 태그로 그룹화된 행에 color 속성을 사용하여 빨간색 글자 색상을 추가해 보겠습니다:

html<table>
  <thead>
    <tr>
      <th>이름</th>
      <th>성</th>
      <th>급여</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>name1</td>
      <td>surn1</td>
      <td>200$</td>
    </tr>
    <tr>
      <td>name2</td>
      <td>surn2</td>
      <td>1000$</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>개수: 2</td>
      <td>-</td>
      <td>총계: 1200$</td>
    </tr>
  </tfoot>
</table>

csstbody {
  color: red;
}

table, td, th {
  border: 1px solid black;
}

Результат:

함께 보기