HTML 참조 매뉴얼

HTML 태그 전체 목록

HTML: <colgroup> 태그

HTML <colgroup> 태그는 테이블의 그룹을 정의하여 각 단일 셀 대신 그룹에 정형화를 적용하거나 클래스를 추가할 수 있도록 합니다. 이 태그는 일반적으로 <colgroup> 요소로도 알려져 있습니다.

온라인 예제

<colgroup>와 <col> 태그는 테이블의 네 개 열에 배경색을 설정합니다:

예제

!doctype　html>
<html>
<head>
<meta　charset="UTF-8">
<title>HTML5　colgroup 태그 사용(기본 튜토리얼 웹3codebox.com)</title>
</head>
<body>
<table>
　　<colgroup>
　　　　<col　span="3"　style="background-color:#FFF9C4">
　　　　<col　style="background-color:yellow;">
　　</colgroup>
　　<thead>
　　　　<tr>
　　　　　　<th>Item</th>
　　　　　　<th>Quantity</th>
　　　　　　<th>Price</th>
　　　　　　<th>Total</th>
　　　　</tr>
　　</thead>
　　<tbody>
　　　　<tr>
　　　　　　<td>Bananas</td>
　　　　　　<td>5</td>
　　　　　　<td>$12</td>
　　　　　　<td>$60</td>
　　　　</tr>
　　</tbody>
</table>
</body>
</html>

테스트를 보세요 ‹/›

　이 HTML5문서 예제에서는 <colgroup>, <thead>, <tbody> 부분을 가진 테이블을 만들었습니다. <colgroup> 부분에서는 두 개의 <col> 태그를 사용했습니다. 첫 번째 <col> 태그는前三列을 그룹화하고 이 열의 배경색을 #FFF로 설정합니다.9C4두 번째 <col> 태그는 네 번째 열을 그룹화하고 배경색을 노란색으로 설정합니다.

브라우저 호환성

IEFirefoxOperaChromeSafari

모든 주요 브라우저가 <colgroup> 태그를 지원합니다.

태그 정의 및 사용 설명

HTML <colgroup> 요소는 <body> 태그 내에 있는 HTML 테이블에 위치합니다.

<colgroup> 태그는 테이블의 열을 조합하여 포맷을 적용하는 데 사용됩니다.
<colgroup> 태그는 테이블의 <caption> 다음에 나타나야 하지만, <thead>, <tr>, <th>, <tbody>, <tfoot> 태그 이전에 나타나야 합니다.

이 <colgroup> 태그를 사용하면 전체 열에 스타일을 적용할 수 있으며, 각 셀이나 행에 스타일을 반복적으로 설정할 필요가 없습니다.

푸시:만약 <colgroup> 내의 특정 열에 다른 속성을 정의하고 싶다면, <colgroup> 태그 내에서 사용하세요. <col> 태그.

HTML 4.01 와 HTML5사이의 차이

HTML5 에서 더 이상 HTML을 지원하지 않습니다. 4.01 속성의 대부분

속성

속성	값	설명
align	left 　right 　center 　justify 　char	HTML5 지원하지 않습니다. 열 조합 내용의 수평 정렬 방식을 정의합니다.
char	character	HTML5 지원하지 않습니다. 열 조합 내용을 정렬하는 데 사용할 문자를 정의합니다.
charoff	number	HTML5 지원하지 않습니다. 첫 번째 정렬 문자의 오프셋을 정의합니다.
span	number	열 조합이 얼마나 많은 열을 가르쳐야 하는지 정의합니다.
valign	top 　middle 　bottom 　baseline	HTML5 지원하지 않습니다. 열 조합 내용의 수직 정렬 방식을 정의합니다.
width	pixels % relative_length	HTML5 지원하지 않습니다. 열 조합의 너비를 정의합니다.