html 테이블

HTML 테이블은 행과 열을 가지는 데이터를 표현하기 위한 요소입니다. 표의 구조를 정의하기 위해서는 table 요소를 사용하고, 행을 추가하기 위해서는 tr 요소를 사용합니다. 각 행 안에는 셀(cell)을 추가하기 위해 td 요소를 사용합니다.

 

테이블의 헤더 부분에는 thead 요소를 사용하고, 본문 부분에는 tbody 요소를 사용합니다. footer 부분이 필요한 경우에는 tfoot 요소를 사용할 수 있습니다. 각 셀 안에는 텍스트, 이미지, 비디오, 또는 다른 HTML 요소를 포함할 수 있습니다.

 

테이블의 모양과 스타일을 변경하기 위해서는 CSS를 사용하여 스타일링할 수 있습니다. 예를 들어, 셀의 경계선 스타일을 변경하거나 셀 간의 간격을 조정할 수 있습니다.

 

사용법

 

<table>
  <thead>
    <tr>
      <th>번호</th>
      <th>이름</th>
      <th>나이</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>홍길동</td>
      <td>30</td>
    </tr>
    <tr>
      <td>2</td>
      <td>이순신</td>
      <td>40</td>
    </tr>
    <tr>
      <td>3</td>
      <td>강감찬</td>
      <td>50</td>
    </tr>
  </tbody>
</table>

 

위의 예시는 세 명의 사람의 번호, 이름, 나이 정보를 담고 있는 테이블입니다. 헤더 부분은 <thead> 요소를 사용하였으며, 각 열의 제목은 <th> 요소로 표현되었습니다. 본문 부분은 <tbody> 요소로 표시되었으며, 각 셀은 <td> 요소로 표현되었습니다.