flex의 쓰임

일단은 부모태그에게 display:flex; 라는 css를 부여해야한다.


layout을 설정하는 방법중하나인데 가장 효과적이다 




생활코딩 flex 설명

https://opentutorials.org/course/2418/13526

-----------------------



종류

<container> 

<item></item>

<item></item>

</container>


* container 속성 :

display

flex-direction  // 태그 방향 정열 방법

flex-wrap     // 줄바꿈이되어 아래로 내려간다...

flex-flow

justify-content

align-items

align-content


* item 속성:

order

flex-grow  //여백을 채우는 것,,,,,,, n분의 1로 쪼개 가져간다..

flex-shrink   // flex의 경우 화면을 줄이면,, 유연하게 줄어드는게 기본설정인데,, 이걸 0으로 설정하면,,  크기가 고정이 되어버린다..

flex-basis

flex

align-self





*flex로 만든 레이아웃 중 대중적인 레이아웃

Holy Grail layout




+ Recent posts