CSS:Flexbox

틀:CSS. css에 대한 문서들을 담아두기 위한 틀.

1. CSS:개요
2. CSS:선택자
3. CSS:크기척도
4. CSS:텍스트
5. CSS:아이콘
6. CSS:속성
   1. CSS:색
   2. CSS:위치와 모양
   3. CSS:Flexbox
   4. CSS:기타속성
7. CSS:변수
8. CSS:진한쌤의 의문

개요

일반적으로

다양한 위치지정 등을 자동으로 계산해주어 반응형으로 위치를 자동으로 바꾸어 정렬한다.

레이아웃을 만들기 위한 강력한 도구.

성질

부모에게 주는 속성과 자식에게 주는 속성으로 나뉜다.

css로 작성한다.

부모의 성질

#container{
    /*기본적으로 가로정렬. colum으로 두면 세로정렬*/
    flex-direction: row;
    /*메인축 정렬. center, end, space-between(요소별로 여백 주기) 등 정렬을 정한다.*/
    justify-content: 
    /*서브축 정렬. 다양한 옵션이 가능하다.*/
    align-content: center;
    
}

자식의 성질

#container .items{
}