[HTML5] 9-3 다단

다단 관련 속성

 

 

 

 

다단 지정

: column-width와 column-count 속성값은 동시에 auto 불가

-단의 폭 지정 : 단의 개수는 요소의 폭에 따라 자동으로 조정

-단의 개수 지정 : 단의 폭은 요소의 폭에 따라 자동으로 조정

 

 

출력:

*column-count

 

 

*column-width

 

 

*columns

 

 

 

 

column-gap 속성

: 단과 단 사이 간격 지정

*값 -> normal(기본 1em), <길이>

 

 

 

 

column-rule 속성

: 단과 단 사이의 구분선 관련 속성(column-rule-*)의 일괄 지정

 

 

예시)

 

 

 

column-span 속성

: 해당 요소를 얼마나 많은 단을 차지해서 표시할 지 지정

*해당 요소에 설정된 다단을 무시하고 하나의 단으로 표시할 지 여부

 

 

 

column-fill 속성

: 각 단을 채우는 콘텐츠의 양을 조절하여 각 단의 높이의 차이를 최소화할지를 지정