공부하자/HTML

테이블 요소 및 테이블 태그 속성

YoBot 2017. 4. 18. 22:52

 테이블 요소 태그


태그 이름

설명

tr

표 내부의 행 태그

th

행 내부의 제목 셀 태그

td

행 내부의 일반 셀 태그

HTML페이지에서 표를 만들 때 사용하는 태그이다.

 

아래 예제를 보면 쉽게 이해할 수 있다.

 

 

<table border ="1">

   <tr>

      <th>행 내부의 제목 셀 태그</th>

      <th>행 내부의 제목 셀 태그</th>

   </tr>

   <tr>

      <td>행 내부의 일반 셀 태그</td>

      <td>행 내부의 일반 셀 태그</td>

   </tr>

   <tr>

      <td>행 내부의 일반 셀 태그</td>

      <td>행 내부의 일반 셀 태그</td>

   </tr>

</table>

 

 


 


테이블 태그 속성


속성 이름

설명

border

표의 테두리 두께를 지정

rowspan

셀의 높이 지정

colspan

셀의 너비 지정

 

아래 예제를 보면 쉽게 이해할 수 있다.

 

<table border ="1"> //테두리 두께 1px 지정

   <tr>

      <th colspan="3">셀의 너비 지정 3</th>

      <th rowspan="3">셀의 높이 지정 3</th>

   </tr>

   <tr>

      <td>Table Data</td>

      <td rowspan="2">셀의 높이 지정 2</td>

      <td>Table Data</td>

   </tr>

   <tr>

      <td>Table Data</td>

      <td>Table Data</td>

   </tr>

</table>