| 속성 |
값 |
설명 |
| align-items: |
|
이 속성을 사용하면 요소의 수직 (세로) 정렬을 한다. |
| center |
주로 수직 가운데 정렬을 위해 사용된다. |
| flex-end |
수직 축의 끝 부분에 정렬한다. |
| flex-start |
요소를 수직 축의 시작 부분에 정렬한다. |
| stretch |
수직으로 늘려서 컨테이너의 높이에 맞게 정렬한다. |
| baseline |
기준선에 정렬한다. 요소의 텍스트 기반 정렬을 사용할 때 유용하다. |
| justify-content |
flex-start |
플렉스 아이템을 가로 축의 시작 부분에 정렬. |
| flex-end |
플렉스 아이템을 가로 축의 끝 부분에 정렬. |
| center |
플렉스 아이템을 가로 축의 중앙에 정렬. |
| space-between |
플렉스 아이템 사이에 동일한 간격을 유지하며 정렬. |
| space-around |
플렉스 아이템 주위에 동일한 간격을 유지하며 정렬. |
| space-evenly |
플렉스 아이템 주위와 아이템들 사이에 동일한 간격을 유지하며 정렬. |
| line-height |
|
텍스트 요소의 줄 간격(라인 높이)을 조절하는 데 사용. |
| word-break |
break-all |
텍스트는 단어가 아무리 길더라도 강제로 줄 바꿈됩니다. 이 옵션을 사용하면 긴 단어가 텍스트 상자의 가로 공간에 맞게 줄 바꿈되며, 단어가 끝까지 가지 못한 경우 단어가 분리됩니다. |