css flex

0307kwon·2021년 3월 1일
0

css

목록 보기
1/2

[css] {flex} - 3

내용

  • [x] 기존 css에서 불가능하거나 굉장히 어렵게 구현했던 것들을 좀 더 쉽게 구현 할 수 있도록 css3에서 추가된 레이아웃 방식.
  • [x] flex는 자식 요소에게만 적용된다. 후손은 적용되지 않음
  • [x] flex의 방향에 따라 scale 100%의 기준이 달라짐
    • ex
      flex-direction: row
      => 자식의 width 100%는 부모 flex-container 기준
      flex-direction: column
      => 자식의 width 100%는 다른 max값을 찾아감(예상과 달라짐)
      height 100%는 부모 flex-container 기준임

링크

개구리 게임(진짜 도움됨)
flexbox로 만들수 있는 10가지 레이아웃

profile
프론트 개발자를 꿈꾸는 학생입니다.

0개의 댓글