티스토리 뷰
Flex Container | CSS Flex Items (ie11) | ||||||
flex-direction: | row | ![]() |
(기본값) | order | number | 0 | 플렉스 항목의 순서지정 |
column | ![]() |
flex-grow | number | 1 | 아이템 비해 얼마나 커질지 | ||
row-reverse | ![]() |
flex-shrink | number | 1 | 아이템 비해 얼마나 작아질지 | ||
column-reverse | ![]() |
flex-basis | px | auto | 초기 길이를 지정 | ||
flex-wrap: | nowrap | ![]() |
(기본값) | ||||
wrap | ![]() |
align-self | auto | align-items : 설정 재정의 | |||
align-content: | normal | (기본값) | stretch | ![]() |
|||
center | ![]() |
center | ![]() |
||||
flex-start | ![]() |
flex-start | ![]() |
||||
flex-end | ![]() |
flex-end | ![]() |
||||
space-around | ![]() |
baseline | ![]() |
||||
space-between | ![]() |
flex | initial | 0 1 auto |
flex-grow, flex-shrink, flex-basis 약식속성 or 단일크기 (px, %) | ||
stretch | ![]() |
auto | 1 1 auto |
0 은 basis 크기 | |||
justify-content: | normal | (기본값) | none | 0 0 auto | 1 은 듄등 크기 | ||
center | ![]() |
||||||
flex-start | ![]() |
||||||
flex-end | ![]() |
||||||
space-between | ![]() |
||||||
space-around | ![]() |
||||||
space-evenly | ![]() |
||||||
align-items: | normal | (기본값) | |||||
center | ![]() |
||||||
flex-start | ![]() |
||||||
flex-end | ![]() |
||||||
stretch | ![]() |
||||||
baseline | ![]() |
'HMLT&CSS&JS > CSS' 카테고리의 다른 글
[CSS] 선언방법 (0) | 2024.02.06 |
---|---|
[scss]sass (0) | 2021.12.10 |
CSS3 요소 (0) | 2017.05.08 |
# CSS 말줄임 (0) | 2013.07.05 |
2. 미디어 쿼리 (0) | 2012.09.13 |
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday