코드랩 레퍼런스
align-content 본문
align-content 속성은 콘텐츠의 상하 관계 정렬 상태를 정의합니다.
| 특징 | 설명 |
|---|---|
| 기본 값 | stretch |
| 상속 | 안됨 |
| 애니메이션 | 안됨 |
| 버전 | CSS3 |
Definition
- align-content 속성은 콘텐츠의 상하 관계 정렬 상태를 정의합니다.
- align-content 속성은 콘텐츠의 상하 관계 정렬 상태를 정의하고 justify-content 속성은 콘텐츠의 좌우 관계 정렬 상태를 정의합니다.
- align-content 속성은 display:flex; 상태에서 적용됩니다.
Syntax
align-content : stretch | center | flex-start | flex-end | space-between | space-around | inherit;
Property
| 속성 값 | 설명 |
|---|---|
| stretch | 요소의 정렬 상태를 기본으로 설정합니다. |
| center | 요소의 상하 정렬 상태를 가운데로 설정합니다. |
| flex-start | 요소의 상하 정렬 상태를 위쪽으로 설정합니다. |
| flex-end | 요소의 상하 정렬 상태를 아래쪽으로 설정합니다. |
| space-between | 요소와 요소사이의 간격을 위쪽과 아래쪽을 기준으로 설정합니다. |
| space-around | 요소와 요소사이의 간격을 가운데를 기준으로 설정합니다. |
| inherit | align-content의 속성 값을 상위요소한테 상속받습니다. |
Compatibility
 |
 |
 |
 |
 |
 |
 6 |
 7 |
8 |
 9 |
 10 |
 11 |
 |
|
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| align-content |
Sample
Ad
Comments