'code col colgroup'에 해당되는 글 1건


 

<CAPTION>

CAPTION 요소는 표에 캡션을 넣을 때 사용합니다. CAPTION 요소는 TABLE 요소 내에 제일 처음에 포함되어야 합니다.

구문: <CAPTION>...</CAPTION>

닫는 태그: 필요

속성

볼드체로 표시된 것은 필수 속성, 회색으로 표시된 것은 HTML 4.01에서 권장하지 않는(deprecated) 속성입니다.

속성 내용
class ClassName CSS의 class 선택자를 지정합니다.
dir rtl
ltr
글자 방향을 지정합니다.
id ElementID CSS의 ID 선택자를 지정합니다.
lang LanguageCode 내용에 사용할 언어를 지정합니다.
style StyleDesc CSS 스타일을 지정합니다.
title Text 웹 브라우저에서 툴팁으로 표시할 추가 설명을 지정합니다.
align bottom
top
left
right
표의 캡션의 정렬 방법을 지정합니다. 인터넷 익스플로러에서 right, left는 규약에 나온 것과 다르게 구현되며 넷스케이프 네비게이터는 top, bottom만 지원합니다.

예제

 <TABLE border="1" width="250">
<CAPTION>나모 웹에디터와 함께 제공되는 유용한 도구</CAPTION>
<TR>
<TH>도구명</TH>
</TR>
<TR>
<TD>나모 그림 나누기</TD>
</TR>
<TR>
<TD>나모 화면 갈무리</TD>
</TR>
<TR>
<TD>나모 GIF 애니메이터</TD>
</TR>
</TABLE> 
나모 웹에디터와 함께 제공되는 유용한 도구
도구명
나모 그림 나누기
나모 화면 갈무리
나모 GIF 애니메이터

지원 브라우저/HTML 버전

이 태그를 지원하는 브라우저의 최소 버전은 아래와 같습니다.

IE all, NN all, HTML 3.2

참고

  • 캡션은 단순한 표에서 표의 요약처럼 사용되며, 복잡한 표에서는 TABLEsummary 속성을 이용하거나 표 밖의 문단에서 표 전체의 요약문을 제공하는 방법을 쓰는 것이 좋습니다.

 

<CENTER>

CENTER 요소는 단락의 컨텐츠를 수직으로 가운데 정렬할 때 사용합니다.

구문: <CENTER>...</CENTER>

닫는 태그: 필요

속성

볼드체로 표시된 것은 필수 속성, 회색으로 표시된 것은 HTML 4.01에서 권장하지 않는(deprecated) 속성입니다.

속성 내용
class ClassName CSS의 class 선택자를 지정합니다.
id ElementID CSS의 ID 선택자를 지정합니다.
lang LanguageCode 내용에 사용할 언어를 지정합니다.
style StyleDesc CSS 스타일을 지정합니다.
title Text 웹 브라우저에서 툴팁으로 표시할 추가 설명을 지정합니다.

예제

 <CENTER>
<TABLE>
<TR align="center">
<TH scope="col">이름</TH>
<TH scope="col">나이</TH>
<TH scope="col">국가</TH>
</TR>
<TR align="center">
<TD>홍길동</TD>
<TD>20</TD>
<TD>한국</TD>
</TR>
</TABLE>
</CENTER> 
CENTER 요소는 단지 표 전체를 가운데 정렬할 뿐 각각의 셀 안의 내용을 가운데 정렬하지는 않습니다. 위 예제에서는 셀 안의 내용을 가운데 정렬하기 위해 TR 요소에 align 속성을 사용했습니다.
이름 나이 국가
홍길동 20 한국

지원 브라우저/HTML 버전

이 태그를 지원하는 브라우저의 최소 버전은 아래와 같습니다.

IE all, NN all, HTML 3.2

참고

  • 브라우저에서 <TABLE align="center"> 또는 스타일 시트를 이용하여 표를 가운데 정렬하는 방법(margin-leftmargin-right를 "auto"로 지정)을 지원하지 않을 때 CENTER 요소가 표를 가운데 정렬하는 데 유용하게 사용됩니다.
  • CENTER 요소는 스타일 시트로 대체되어 HTML 4.01에서 권장하지 않는(deprecated) 요소입니다.

 

<CITE>

CITE 요소는 잡지나 신문의 제목, 참고 자료명 등을 표시할 때 사용합니다.

구문: <CITE>...</CITE>

닫는 태그: 필요

속성

볼드체로 표시된 것은 필수 속성, 회색으로 표시된 것은 HTML 4.01에서 권장하지 않는(deprecated) 속성입니다.

속성 내용
class ClassName CSS의 class 선택자를 지정합니다.
id ElementID CSS의 ID 선택자를 지정합니다.
lang LanguageCode 내용에서 사용할 언어를 지정합니다.
style StyleDesc CSS 스타일을 지정합니다.
title Text 웹 브라우저에서 툴팁으로 표시할 추가 설명을 지정합니다.

예제

 제가 감명 깊게 읽은 소설은 황순원의 <CITE>소나기</CITE>입니다. 
CITE 요소로 지정한 부분은 웹 브라우저에서 이탤릭체로 표시됩니다. 그러나 스타일 시트를 사용하여 형태를 변경할 수 있습니다.
제가 감명 깊게 읽은 소설은 황순원의 소나기입니다.

지원 브라우저/HTML 버전

이 태그를 지원하는 브라우저의 최소 버전은 아래와 같습니다.

IE all, NN all, HTML all


 

<CODE>

CODE 요소는 컴퓨터 코드 등을 표시할 때 사용합니다.

구문: <CODE>...</CODE>

닫는 태그: 필요

속성

볼드체로 표시된 것은 필수 속성, 회색으로 표시된 것은 HTML 4.01에서 권장하지 않는(deprecated) 속성입니다.

속성 내용
class ClassName CSS의 class 선택자를 지정합니다.
id ElementID CSS의 ID 선택자를 지정합니다.
lang LanguageCode 내용에서 사용할 언어를 지정합니다.
style StyleDesc CSS 스타일을 지정합니다.
title Text 웹 브라우저에서 툴팁으로 표시할 추가 설명을 지정합니다.

예제

 <CODE>
class HelloWorld {
public static void main(String[] args) {
System.out.println("안녕하세요!");
}
}
</CODE> 
CODE 요소로 지정한 부분은 브라우저에서 고정폭 글자로 표시됩니다. 그러나 스타일 시트를 사용하여 다르게 표현할 수도 있습니다.
class HelloWorld { public static void main(String[] args)
{ System.out.println("안녕하세요!"); } }

지원 브라우저/HTML 버전

이 태그를 지원하는 브라우저의 최소 버전은 아래와 같습니다.

IE all, NN all, HTML all

참고

  • 코드를 표시할 때는 가독성을 높이기 위해 형식을 유지하는 것이 중요합니다. PRE 요소 안에 CODE 요소를 사용하면 형식을 유지할 수 있습니다.

 

<COL>

COL 요소는 표의 세로줄을 지정할 때 사용합니다. COL 요소는 TABLE 요소 내에서 CAPTION 뒤에 THEAD 앞에 위치해야 합니다. COLGROUP과 달리 COL은 세로줄을 구조적으로 그룹핑하지 않으며 단순히 하나 이상 세로줄에 공통적인 속성을 정의합니다. COL요소는 TABLE 요소 안에 바로 포함되거나 COLGROUP 안에 포함될 수 있습니다. COL 요소가 COLGROUP 안에 있을 때, COL 속성은 COLGROUP 속성보다 우선합니다.

구문: <COL>

닫는 태그: 없음

속성

볼드체로 표시된 것은 필수 속성, 회색으로 표시된 것은 HTML 4.01에서 권장하지 않는(deprecated) 속성입니다.

속성 내용
char Character 셀의 정렬 기준 문자를 지정합니다.
charoff Length 문자 기준 정렬의 기준점(offset)을 지정합니다. 픽셀수 또는 셀 너비의 비율로 지정합니다. charoff="50%"는 문자를 셀의 중앙에 수평으로 정렬합니다.
class ClassName CSS의 class 선택자를 지정합니다.
width MultiLength 각 세로줄의 너비를 지정합니다.
dir rtl
ltr
글자 방향을 지정합니다.
id ElementID CSS의 ID 선택자를 지정합니다.
lang LanguageCode 내용에 사용할 언어를 지정합니다.
span Character COL 요소의 속성을 공유할 셀의 개수를 지정합니다.
style StyleDesc CSS 스타일을 지정합니다.
align left
right
center
justify
char
가로 정렬 방법을 지정합니다. 기본값은 left입니다.
valign top
middle
bottom
baseline
세로 정렬 방법을 지정합니다. 기본값은 middle입니다.

예제

 <TABLE border="1">
<COL width="50%">
<COL span="2" width="25%" align="right">
<TR>
<TD>대청봉</TD>
<TD>설악산</TD>
<TD>강원도</TD>
</TR>
<TR>
<TD>천왕봉</TD>
<TD>지리산</TD>
<TD>전라도</TD>
</TR>
</TABLE> 
위 예제에서 첫번째 COL 요소는 첫번째 세로줄에 적용되며, 두번째 COL 요소는 두번째와 세번째 세로줄에 적용됩니다.
대청봉 설악산 강원도
천왕봉 지리산 전라도

지원 브라우저/HTML 버전

이 태그를 지원하는 브라우저의 최소 버전은 아래와 같습니다.

IE 3, NN n/a, HTML 4

참고

  • 넷스케이프에서는 COL 요소가 지원되지 않기 때문에 너비와 정렬 속성을 지정은 TDTH 요소 안에서 해줍니다.
  • 인터넷 익스플로러에서는 align="char"를 지원하지 않습니다.

 

<COLGROUP>

COLGROUP 요소는 표의 세로줄 그룹을 만들 때 사용합니다. COLGROUP 요소는 TABLE 요소 내에서 CAPTIONTHEAD 앞에 위치해야 합니다. COLGROUP을 사용하여 표의 세로줄 그룹을 만들어 높으면 스타일 시트를 사용하여 보다 쉽게 다양한 표현을 지정할 수 있습니다.

구문: <COLGROUP>...</COLGROUP>

닫는 태그: 선택

속성

볼드체로 표시된 것은 필수 속성, 회색으로 표시된 것은 HTML 4.01에서 권장하지 않는(deprecated) 속성입니다.

속성 내용
char Character 셀의 정렬 기준 문자를 지정합니다.
charoff Length 문자 기준 정렬의 기준점(offset)을 지정합니다. 픽셀수 또는 셀 너비의 비율로 지정합니다. charoff="50%"는 문자를 셀의 중앙에 수평으로 정렬합니다.
class ClassName CSS의 class 선택자를 지정합니다.
dir rtl
ltr
글자 방향을 지정합니다.
id ElementID CSS의 ID 선택자를 지정합니다.
lang LanguageCode 내용에 사용할 언어를 지정합니다.
span Character 그룹화할 세로줄의 개수를 지정합니다.
style StyleDesc CSS 스타일을 지정합니다.
width MultiLength 세로줄 그룹의 너비를 지정합니다.
align left
right
center
justify
char
가로 정렬 방법을 지정합니다. 기본값은 left입니다.
valign top
middle
bottom
baseline
세로 정렬 방법을 지정합니다. 기본값은 middle입니다.

예제

 <TABLE border="1">
<COLGROUP width="50%"></COLGROUP>
<COLGROUP span="2" width="25%">
<COL align="right">
</COLGROUP>
<TR>
<TD>대청봉</TD>
<TD>설악산</TD>
<TD>강원도</TD>
</TR>
<TR>
<TD>천왕봉</TD>
<TD>지리산</TD>
<TD>전라도</TD>
</TR>
</TABLE> 
위 예제에서 첫번째 COLGROUP 요소는 첫번째 세로줄에 적용되며, 두번째 COLGROUP 요소는 두번째와 세번째 세로줄에 적용됩니다. 두번째 COLGROUP 요소 안에 있는 COL 요소가 우선시되어 그룹의 첫번째 세로줄에 적용됩니다.
대청봉 설악산 강원도
천왕봉 지리산 전라도

지원 브라우저/HTML 버전

이 태그를 지원하는 브라우저의 최소 버전은 아래와 같습니다.

IE 3, NN n/a, HTML 4

참고

  • COLGROUP 요소 안에 COL 요소가 있을 때, COL 속성은 COLGROUP 속성보다 우선합니다.

출처 : 웹 디자인 그룹"(Web Design Group), Copyright ⓒ 2003-2005 (주)세중 나모 인터랙티브


Posted by 굿프랜
1

굿프랜