Table 태그

ⓐ TABLE 

 

① 정의

 

- 표의 시작과 끝을 나타낼 때 사용하는 태그

 

② 관련 태그

 

- CAPTION :: 표 이름을 정할 때 사용 ( 없어도 무관 )

- TH :: 제목 셀을 만들 때 사용 ( 없어도 무관 )

- TR :: 행의 구분을 지을 때 사용

- TD :: 데이터 셀을 만들 때 사용

 

ex ) <TABLE>

         <TR>

            <TH> 제목1 </TH>

            <TD> 내용 1 </TD>

         </TR>

         <TR>

             <TH> 제목 2 </TH>

             <TD> 내용 2 </TD>

         </TR>

         </TABLE>

라고 쓰게 된다면 결과물은 단순히

 

제목1   내용1

제목2   내용2

 

로 나오게 된다. 결과물을 보았을 때에는 아무런 선 표시도 존재하징낳고 글자만 저렇게 분리되 있으므로

일부로 표처럼 보이지않고 정돈되게 글을 적을 때에도 사용된다고 한다.

 

③ 테이블 태그 속성

 

㉠ <width=" "> "" 사이에는 픽셀수나 %가 들어가며 표의 전체 너비를 정한다.

㉡ <height=" "> "" 사이에는 픽셀수나 %가 들어가며 표의 전체 높이를 정한다.

㉢ <bgcolor=" "> "" 사이에는 #RRGGBB가 들어가며 표의 배경색을 정한다.

㉣ <background=" ">"" 사이에는 이미지의 이름과 위치가 들어가며 표의 배경 이미지를 정한다.

㉤ <align> 표의 정령방식을 정한다. "" 사이에는 right나 left 혹은 top 과 같은 것이 드간다.

㉥ <cellpadding=" "> ""사이에는 숫자가 들어가며 셀 안의 여백을 정한다.

㉦ <cellspacing=" "> ""사이에는 숫자가 들어가며 셀 간의 여백을 정한다.

㉧ <border=" "> 보통 표에 나오는 선같은걸 넣는 속성태그가 이것이며. "" 사이에는 픽셀 수가

                         들어간다.

㉨ <bordercolor=" "> 테두리의 색을 결정할 때 들어가며 "" 사이에는 #RRGGBB가 들어간다.

㉩ <bordercolordark=" "> "" 사이에는 #RRGGBB가 들어가며 표의 그림자를 정한다.

㉪ <frame=" "> "" 사이에는 voide, hside, vside 등이 들어가며 테이블선의 유무를 정한다.

㉫ <rules=" "> "" 사이에는 none, rows, cols 등이 들어가며 테이블 안쪽 경계선의 지정에 관여한다.

㉬ <hspace=" "> "" 사이에는 left, right가 들어가며 테이블 내용의 수평 정렬을 정한다.

㉭ <vspace=" "> ""사이에는 top, bottom가 들어가며 테이블 내용의 수직 정렬을 정한다.

㉮ <colspan=" "> ""사이에는 숫자가 들어가며 여러 열에 걸친 셀을 병합하는 태그이다.

㉯ <rowspan=" "> ""사이에는 숫자가 들어가며 여러 행에 걸친 셀을 병합하는 태그이다.

 

④ 추가 설명

 

㉢,㉣ -> <TABLE>에 사용하면 표 전체에 지정하는 속성 태그가 된다.

              <TD> or <TH>에 사용할 시에는 각각의 셀에만 지정 되며 <TABLE>태그에 지정한것 보다

               우선순위를 지닌다.

               <TR>에 사용시 줄 단위로 지정하게 되며 ㉣은 제외다.

 

<TD>에는 ㉠만 사용이 가능하며 <TR>에는 ㉡만 사용이 가능하다.

 

㉤ 을 <TR>에 사용하게되면 테이블 속 모든 데이터를 정렬할 수 있다.

 

㉤ 을 <TABLE> 태그에 사용하면 텍스트와 표를 나란히 배치할 수 있다