- <table> 태그 - 열
- <tr> 태그 - 행
- <tr> 태그 - 열
Table 기본태그
- <table>
표 전체를 감싸는데 사용한다.
- <caption>
표의 제목 태그이다
- <tr>
표의 행을 의미하는 태그, 자손으로<th>태그<td>가 있어야 한다.
- <th>
표의 제목열을 담당하는 태그, 부모 태그인 <tr>태그 안에 있어야 한다.
- <td>
표의 열을 담당하는 태그, 부모인 <tr> 태그 안에 있어야 한다.
Table 그룹 관련 태그
- <colgroup>
열을 그룹으로 묶을 수 있도록 해주는 태그이다.
- <col>
<colgroup>태그의 자식으로 열 단위를 나눌 수 있다. span 속성을 사용하여 열을 그룹으로 묶을지 설정한다. 예) <col span= "5" →5개의 열을 그룹으로 묶는다.
- <thaed>
표의 제목 열들을 묶는 그룹 태그
- <tbody>
표의 일반적인 데이터들을 묶는 그룹태그
기본적으로 행그룹태르를 사용하지 않으면 크롬브라우저가 자동으로 tbody태그로 묶어준다.
- <tfoot>
표의 하단 영역을 묶는 그룹태그
Table 태그 관련 속성
- <table> 태그 속성
- border - 테이블이 갖고 있는 테이블과 셀 모두 선을 표시한다. 웹표준(X)
- width - 테이블의 가로폭을 설정하는 속성. 웹표준(X)
- cellpadding - 셀 테두리 안쪽 여백 셀과 콘텐츠와의 간격을 조잘한다. 웹표준(X)
- cellspacing - 셀의 바깥쪽 여백, 셀과 셀간의 간격을 조절한다. 웹표준(X)
위 속성들은 XHTML1.0에서는 웹 표준이지만 오늘날 HTML5에서는 웹 표준이 아닙니다. CSS로 대체해야한다.
- <th> 태그 속성
- scope - 웹 접근성 관련 속성으로 스크린리더가 테이터를 인식하고 읽는 순서를 결정짓게 합니다.
- th가 열에 쓰일 경우 값을 "col"로 설정합니다. 예) <th scope = "col">
- th가 행에 쓰일 경우 값을 "row"로 설정합니다. 예) <th scope = "row">
- <th>, <td>
- colspan - 열을 병합하는 속성 예)<td colspan = "3">
- rowspan - 행을 병합하는 속성 예)<td rowspan = "3">
- <col>
- width -열의 가로너비를 지정하지만 웹표준X -CSS로 대체
- span - 열을 그룹화한다. 예) <col span ="6"> 6개의 열을 묶는다.
댓글 없음:
댓글 쓰기