English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

HTML 참고서

HTML 태그 전체 목록

HTML: <colgroup> valign 속성

HTML에서5 에서는 <colgroup> valign 속성을 지원하지 않습니다. valign 속성은 열 그룹 내의 내용의 수직 정렬 방식을 정의합니다.

 HTML <colgroup> 태그

온라인 예제

다양한 수직 정렬 방식을 가진 HTML 테이블 하나:

!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML <colgroup> span 속성 사용-기본 강의(oldtoolbag.com)</title>
<style>table, th, td {  border: 1px solid black;}</style>
</head>
<body>
<table style="height:200px">
  <colgroup valign="top">
  <colgroup valign="bottom">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
</body>
</html>
테스트를 해보세요 ‹/›

브라우저 호환성

IE파이어폭스오페라크롬사파리

인터넷 익스플로러와 오페라만 valign 속성을 지원합니다. 그러나 IE와 오페라는 'baseline' 속성 값을 지원하지 않습니다.

정의와 사용 방법

HTML에서5 중에서 <colgroup> valign 속성을 지원하지 않습니다.

valign 속성은 열 그룹 내의 콘텐츠의 수직 정렬 방식을 정의합니다.

문법

<colgroup valign="top|middle|bottom|baseline">

속성 값

설명
top콘텐츠를 위로 정렬합니다.
middle콘텐츠를 가운데 정렬합니다(기본 값).
bottom콘텐츠를 아래에 정렬합니다.
baseline기준선에 맞추어 정렬합니다. 기준선은 가상의 선입니다. 한 줄의 텍스트에서 대부분의 글자는 기준선을 기준으로 합니다. baseline 값은 행 내의 모든 테이블 데이터가 공통된 기준선을 공유하게 합니다. 이 값의 효과는 종종 bottom 값과 같습니다. 그러나 문자 크기가 다를 때 baseline의 효과가 더 좋습니다. 아래 그림을 참조하세요.

문자 크기가 다를 때, bottom vs. baseline 그림:

valign="bottom"

valign="baseline"

 HTML <colgroup> 태그