<table> 태그 속성
본문 내에 표를 만드는 태그입니다.
가장 많이 쓰이는 태그 이며, 홈페이지 내에서 많은 응용력을 필요로 합니다. 이 태그만 잘 사용해도 홈페이지 분위기가 달라집니다.
1. align="값" (값 = left / center / right)
: 표의 정렬 상태를 설정 합니다.
2. background="이미지 파일 경로"
:배경이 될 이미지 파일의 경로를 지정해 줍니다.
3. bgcolor="값" (값 = 색이름 / SRGB)
: 배경 색상을 지정해 줍니다.
4. bordercolor="값" (값 = 색이름 / SRGB)
:표의 외곽선의 색상을 지정해 줍니다.
5. border="픽셀"
: 표의 외곽선의 두께를 설정하며, 값이 "0"이면 외곽선이 보이지 않습니다.
6. bordercolordark="값" (값 = 색이름 / SRGB)
: 표의 외곽선을 3차원으로 만들때 사용되는 어두운 색을 지정
7. bordercolorlight="값" (값 = 색이름 / SRGB)
: 표의 외곽선을 3차원으로 만들 때 사용되는 밝은 색을 지정
8. cellpadding="픽셀"
: 셀 경계와 셀 안의 내용과의 간격을 지정
9. cellspacing="픽셀"
: 셀과 셀 사이의 간격을 지정
10. cols="숫자"
: 표에 들어갈 열의 개수를 지정
11. class="클래스 이름"
: 스타일 시트의 서식을 적용
12. frame="값" (값 = above / below / border / hsides / Lhs / rhs / vside / void)
: 표 외곽선의 형태를 지정 border="1" 이상일 때 사용할 수 있습니다.
13. height="픽셀"
: 표의 높이를 설정
14. hspace="픽셀"
: 표 위아래로 표 외곽 내용들과의 간격을 설정합니다.
15. id="id 이름"
: class와 동일한 기능. 다만 홈페이지 내에서 한번만 명시 할 수 있습니다.
16. rules="값" (값 = cols / rows / none / all / group)
: 표에서 셀 사이에 경계선을 설정합니다.
17. style="스타일 시트 입력"
: 적용될 스타일 시트를 지정
18. title="제목"
: 해당 문자에 부여할 텍스트를 입력. 브라우저에서는 풍선 도움말로 표
19. width="픽셀/(%)"
: 표의 너비를 설정 하며, 브라우저를 대비한 비율을 퍼센트로 사용 하기도 합니다.
<tr> 태그 속성
표의 행을 만드는 태그 입니다.
1. align="값" (값 = left / center / right / justify / char)
: 행에 들어갈 내용의 정렬 상태를 설정 합니다.
2. bgcolor="값" (값 = 색이름 / SRGB)
: 배경 색상을 지정해 줍니다.
3. bordercolor="값" (값 = 색이름 / SRGB)
: 표의 외곽선의 색상을 지정해 줍니다.
4. bordercolordark="값" (값 = 색이름 / SRGB)
: 표의 외곽선을 3차원으로 만들때 사용되는 어두운 색을 지정
5. bordercolorlight="값" (값 = 색이름 / SRGB)
: 표의 외곽선을 3차원으로 만들 때 사용되는 밝은 색을 지정
6. char="기준 알파벳"
: align 속성값을 "char"로 했을 때 정렬을 기준으로 할 문자를 지정
7. charoff="문자 개수"
: align 속성값을 "char"로 했을 때 정렬을 기준으로 할 문자를 지정
8. class="클래스 이름"
: 스타일 시트의 서식을 적용
9. id="id 이름"
: class와 동일한 기능. 다만 홈페이지 내에서 한번만 명시 할 수 있습니다.
10. style="스타일 시트 입력"
: 적용될 스타일 시트를 지정
11. title="제목"
: 해당 문자에 부여할 텍스트를 입력. 브라우저에서는 풍선 도움말로 표시
12. nowrap
: 한 행의 줄바꿈 기능을 해제합니다. 3.0, 3.0 이상
13. valign="값" (값 = top / bottom / center / baseline)
: 행에 들어가는 내용의 정렬 방식을 위아래를 기준으로 설정
<td> 태그 속성
표 내에 셀을 삽입하며,<td>태그는 반드시 <tr>태그안에 들어가야합니다.
1. align="값" (값 = left / center / right / justify / char)
: 행에 들어갈 내용의 정렬 상태를 설정 합니다.
2. axis="셀 이름"
: 셀의 이름을 설정합니다.
3. axes="관련 내용"
: 셀의 내용과 부합하는 이름을 나열합니다.
4. backgroungd="이미지 파일 경로"
: 셀 안에 배경이 될 이미지 파일의 경로를 지정
5. bgcolor="값" (값 = 색이름 / SRGB)
: 셀의 배경 색상을 지정
6. bordercolor="값" (값 = 색이름 / SRGB)
: 셀 경계선에 색상을 지정
7. bordercolordark="값" (값 = 색이름 / SRGB)
: 셀 경계선을 3차원으로 만들때 사용되는 어두운 색을 지정
8. bordercolorlight="값" (값 = 색이름 / SRGB)
: 셀 경계선을 3차원으로 만들 때 사용되는 밝은 색을 지정
9. char="기준 알파벳"
: align 속성값을 "char"로 했을 때 정렬을 기준으로 할 문자를 지정
10 charoff="문자 개수"
: align 속성값을 "char"로 했을 때 정렬을 기준으로 할 문자를 지정
11. class="클래스 이름"
: 스타일 시트의 서식을 적용
12. colspan="숫자"
: 두개 이상의 열의 공간을 하나의 열로 만들 때 사용
13. id="id 이름"
: class와 동일한 기능. 다만 홈페이지 내에서 한번만 명시 할 수 있습니다.
14. rowspan="숫자"
: 두개 이상의 행의 공간을 하나의 행으로 만들 때 사용.
15. style="스타일 시트 입력"
:적용될 스타일 시트를 지정
16. title="제목"
: 해당 문자에 부여할 텍스트를 입력. 브라우저에서는 풍선 도움말로 표시
17. nowrap
: 셀 안의 줄바꿈 기능을 해제합니다.
18. valign="값" (값 = top / bottom / center / baseline)
: 행에 들어가는 내용의 정렬 방식을 위아래를 기준으로 설정
<th> 태그 속성
보통은 표에 가장 윗 줄에 위치하며 각 열의 제목을 나타낼 때 쓰며, 태그자 적용되면 글꼴이 굵게 되고 가운데 정렬이 됩니다.
1. align="값" (값 = left / center / right / justify / char)
: 행에 들어갈 내용의 정렬 상태를 설정 합니다.
2. axis="셀 이름"
: 셀의 이름을 설정합니다.
3. axes="관련 내용"
: 셀의 내용과 부합하는 이름을 나열합니다.
4. backgroungd="이미지 파일 경로"
: 셀 안에 배경이 될 이미지 파일의 경로를 지정
5. bgcolor="값" (값 = 색이름 / SRGB)
: 셀의 배경 색상을 지정
6. bordercolor="값" (값 = 색이름 / SRGB)
: 셀 경계선에 색상을 지정
7. bordercolordark="값" (값 = 색이름 / SRGB)
: 셀 경계선을 3차원으로 만들때 사용되는 어두운 색을 지정
8. bordercolorlight="값" (값 = 색이름 / SRGB)
: 셀 경계선을 3차원으로 만들 때 사용되는 밝은 색을 지정
9. char="기준 알파벳"
: align 속성값을 "char"로 했을 때 정렬을 기준으로 할 문자를 지정
10. charoff="문자 개수"
: align 속성값을 "char"로 했을 때 정렬을 기준으로 할 문자를 지정
11. class="클래스 이름"
: 스타일 시트의 서식을 적용
12. colspan="숫자"
: 두개 이상의 열의 공간을 하나의 열로 만들 때 사용
13. id="id 이름"
: class와 동일한 기능. 다만 홈페이지 내에서 한번만 명시 할 수 있습니다.
14. rowspan="숫자"
: 두개 이상의 행의 공간을 하나의 행으로 만들 때 사용
15. style="스타일 시트 입력"
: 적용될 스타일 시트를 지정
16. title="제목"
: 해당 문자에 부여할 텍스트를 입력. 브라우저에서는 풍선 도움말로 표시
17. nowrap
: 셀 안의 줄바꿈 기능을 해제합니다.
18. valign="값" (값 = top / bottom / center / baseline)
: 행에 들어가는 내용의 정렬 방식을 위아래를 기준으로 설정
<caption> 태그 속성
이 태그는 <TABLE>태그 내에서만 사용 되며, 테이블에 대한 제목이나 설명을 기재 할 때 사용합니다. HTML 3.2 표준이지만 Netscape에서는 Align 속성이 적용되지 않습니다.
1. align="값" (값 = top / bottom / left / right)
: caption 태그의 내용의 정렬 방식을 지정
2. id="id 이름"
: class와 동일한 기능. 다만 홈페이지 내에서 한번만 명시 할 수 있습니다.
3. class="클래스 이름"
: 스타일 시트의 서식을 적용
4. style="스타일 시트 입력"
:적용될 스타일 시트를 지정
5. title="제목"
: 해당 문자에 부여할 텍스트를 입력. 브라우저에서는 풍선 도움말로 표시
<colgroup> 태그 속성
테이블의 그룹에 대한 속성을 설정 하며, 시작 태그만 사용 합니다
1. align="값" (값 = top / bottom / left / right)
: colgroup태그의 내용이 어느 쪽에 정렬할 것인지를 지정
2. id="id 이름"
: class와 동일한 기능. 다만 홈페이지 내에서 한번만 명시 할 수 있습니다.
3. char="기준 알파벳"
: align 속성값을 "char"로 했을 때 정렬을 기준으로 할 문자를 지정
4. charoff="문자 개수"
: align 속성값을 "char"로 했을 때 정렬을 기준으로 할 문자를 지정
5. span="열 개수"
: 열의 개수를 지정
6. style="스타일 시트 입력"
: 적용될 스타일 시트를 지정
7. width="픽셀"
: 열의 셀 너비를 설정
8. valign="값" (값 = top / bottom / center / baseline)
:열에 들어가는 내용들의 정렬 방식을 위아래 기준으로 설정
<col> 태그 속성
각 열에 대한 속성을 설정 하며, 시작 태그만 사용 합니다.
1. align="값" (값 = top / bottom / left / right)
: col태그의 내용이 어느 쪽에 정렬할 것인지를 지정
2. id="id 이름"
: class와 동일한 기능. 다만 홈페이지 내에서 한번만 명시 할 수 있습니다.
3. char="기준 알파벳"
: align 속성값을 "char"로 했을 때 정렬을 기준으로 할 문자를 지정
4. charoff="문자 개수"
: align 속성값을 "char"로 했을 때 정렬을 기준으로 할 문자를 지정
5. span="열 개수"
: 열의 개수를 지정
6. style="스타일 시트 입력"
: 적용될 스타일 시트를 지정
7. width="픽셀"
: 열의 셀 너비를 설정
8. valign="값" (값 = top / bottom / center / baseline)
: 열에 들어가는 내용들의 정렬 방식을 위아래 기준으로 설정