Flex Items : flex-shrink & flex-basis & flex

한서희·2021년 12월 22일

🥝 flex-shrink

  • Item이 감소하는 너비의 비율을 설정
  • 숫자가 크면 더 많은 너비가 감소한다.
  • Item이 가변 너비가 아니거나, 값이 0일경우 효과가 없다.
  • 기본값 1

🥝 flex-basis

  • Item의 (공간 배분 전) 기본 너비를 설정한다.
  • 값이 auto일 경우 width, height 등의 속성으로 Item의 너비를 설정할 수 있다.
  • 단위값이 주어지면 설정 할 수 없다.
  • 기본값 auto

🥝 flex

  • Item의 너비(증가, 감소 기본)을 설정하는 단축 속성
  • flex : flex-grow flex-shrink flsx-basis;
  • flex : 증가너비 감소너비 기본너비;
  • flex-basis 값을 명시하지 않는다면 auto(기본값)가 아닌 1로 지정됨
profile
안녕하세요, 개발자를 꿈꾸는 한서희입니다.

0개의 댓글