COLGROUP, COL elements

<COLGROUP>, <COL>
◀ ■ ▶

앞 장에 나왔던 THEAD, TFOOT, TBODY가 여러 개의 행을 하나의 그룹으로 묶어주는 element들이라면, COLGROUP과 COL은 여러 개의 열을 하나의 그룹으로 묶어주는 element들이다. 시작 태그는 반드시 써야하며, 끝내는 태그는 쓰지 않는다.

COLGROUP을 쓰면 행 그룹과 마찬가지로, 열 그룹에도 특정한 스타일을 적용할 수 있다.

COL은 여러 개의 열을 그룹화하지는 않고, 다만 COL 안에 사용한 속성이 COL로 묶여 있는 셀들에 동일하게 적용된다. COLGROUP에 들어 있는 열 중에서 특정 열에만 스타일을 적용하고 싶을 때도 COL을 사용할 수 있다. Id나 class 속성을 쓰면 된다.

THEAD, TFOOT, TBODY, COLGROUP, COL을 사용하면, TABLE의 rules = groups 속성을 사용해 각각의 그룹마다 경계선을 그릴 수 있다.

<TABLE border=2 frame=hsides rules=groups>

<COLGROUP align=left>
<COLGROUP align=right>
   <COL span=2 width=30>
<COLGROUP align=center span=3>
<THEAD>
<TR>
   <TH>이름<TH>남<TH>여<TH>빨강<TH>파랑<TH>노랑
<TBODY>
<TR>
   <TD>갑돌이<TD><TD><TD>X<TD>X<TD>*
<TR>
   <TD>팔복이<TD>X<TD><TD>X<TD>X<TD>X
<TR>
   <TD>몽룡이<TD>X<TD><TD>X<TD>X<TD>X
<TBODY>
<TR>
   <TD>갑순이<TD><TD>X<TD>X<TD>X<TD>X
<TR>
   <TD>셋째딸<TD><TD>X<TD><TD><TD>X
<TR>
   <TD>춘향이<TD><TD>X<TD><TD><TD>X
<TR>
   <TD>향단이<TD><TD>X<TD><TD><TD>X
</TABLE> 이렇게 나와요

속성

span, width
align, valign
id, class
title
style
onclick, ondlclick, onmouseup, onmousedown, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

span = 숫자

몇 개의 열을 하나의 그룹으로 묶을 것인지를 말해주는 속성이다.

width = 숫자

해당 그룹 안에 들어있는 각 열의 가로 폭을 정한다. 단위는 픽셀이다.

◀ ■ ▶