<table> - 테이블을 만들기 시작할 때 사용
<tr> - 하나의 행(가로줄)을 만들 때 사용 (table row)
<th> - 하나의 열(칸)을 대표하는 셀 만들 때 사용 (table header)
<td> - 하나의 열(칸)의 데이터를 만들 때 사용 (table data)
테이블의 레이아웃에 영향을 주지 않고 묶을 때 사용하는 태그
<thead> - 표의 머리글
<tbody> - 표의 본문
<tfoot> - 표의 바닥글 (총합, 요약 등에 사용)
<table>
<thead>
<tr>
<th> ID </th>
<th> 이름 </th>
<th> 취미 </th>
</tr>
</thead>
<tbody>
<tr>
<td> lightixxx </td>
<td> 라이틱스 </td>
<td> 사진촬영 </td>
</tr>
<tr>
<td> lalala </td>
<td> 라라라 </td>
<td></td> <!-- 빈칸이더라도 th의 개수와 맞춰준다 -->
</tr>
</tbody>
<tfoot>
</tfoot>
</table>
🚨 Syntax alert 🚨
<th>와 <td>의 개수를 맞춰야 한다
단, rowspan이나 colspan으로 확장이 된 경우는 생략한다
추가 attribute
rowspan=" " : 숫자만큼 행 병합
colspan=" " : 숫자만큼 열 병합
scope=" " : 누구의 머리글 칸인지 명시 (col, colgroup, row, rowgroup)
'學習_학습 > HTML' 카테고리의 다른 글
form 태그와 관련된 태그 6 <button> (0) | 2020.06.30 |
---|---|
form 태그와 관련된 태그 5 <textarea> (0) | 2020.06.30 |
form 태그와 관련된 태그 4 <select> & <option> (0) | 2020.06.30 |
form 태그와 관련된 태그 3 <radio> vs <checkbox> (0) | 2020.06.30 |
form 태그와 관련된 태그 2 <label> (0) | 2020.06.30 |