CSS 컬럼 카운트 속성

정의와 사용법

column-count 속성은 요소가 나누어져야 할 열 수를 정의합니다.

다른 것을 참조하세요:

CSS3 가이드:CSS3 다중 열

HTML DOM 참조 가이드:columnCount 속성

예제

div 요소 내의 텍스트를 세 열로 나눕니다:

div
{
column-count:3;
}

직접 시도해 보세요

페이지 하단에 더 많은 예제가 있습니다.

CSS 문법

column-count: number|auto;

속성 값

값 설명 테스트
number 요소 내용이 나누어질 최적의 열 수. 테스트
auto 다른 속성에 의해 열 수가 결정됩니다. 예를 들어, "column-width". 테스트

기술 세부 사항

기본 값: auto
thừa kế: no
버전: CSS3
JavaScript 문법: object.style.columnCount=3

더 많은 예제

Column-gap
div 요소 내의 텍스트를 세 열로 나누고, 열 간 30 픽셀 간격을 정의합니다.
Column-rule
칼럼 간의 너비, 스타일, 그리고 색상을 정의합니다.

브라우저 지원

표에서의 숫자는 이 속성을 최초로 지원하는 브라우저 버전을 나타냅니다.

크롬 IE / 엣지 파이어폭스 사파리 오페라
50.0
4.0 -webkit-		 10.0 52.0
2.0 -moz-		 9.0
3.1 -webkit-		 37.0
15.0 -webkit
11.1