Style flexShrink 속성

정의와 사용법

flex-shrink 속성은 아이템이 동일한 컨테이너 내의 다른 엘라스틱 아이템에 비해 어떻게 축소될지 정의합니다.

주석:요소가 엘라스틱 아이템이 아니면 flex-shrink 속성이 유효하지 않습니다.

다른 참조:

CSS 참조 설명서:flex-shrink 속성

예제

파란색 DIV 요소가 다른 엘라스틱 아이템보다 5배로 축소되도록 합니다:

document.getElementById("myBlueDiv").style.flexShrink = "5";

직접 시도해 보세요

문법

flex-shrink 속성 반환:

object.style.flexShrink

flex-shrink 속성 설정:

object.style.flexShrink = "number|initial|inherit"

속성 값

값 설명
number 숫자로, 엘라스틱 아이템 중 하나가 다른 엘라스틱 아이템에 비해 얼마나 축소될지 정의합니다. 기본 값은 0입니다.
initial 이 속성을 기본 값으로 설정합니다. 참조하십시오: initial.
inherit 부모 요소에서 이 속성을 상속합니다. 참조하십시오: inherit.

기술 세부 사항

기본 값: 1
반환 값: 문자열로, 요소의 flex-shrink 속성.
CSS 버전: CSS3

브라우저 지원

표의 숫자는 이 속성을 최초로 완전히 지원한 브라우저 버전을 나타냅니다.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
지원 11.0 지원 9.0 지원

관련 페이지

HTML DOM STYLE 참조 설명서:flex 속성

HTML DOM STYLE 참조 설명서:flexBasis 속성

HTML DOM STYLE 참조 설명서:flexDirection 속성

HTML DOM STYLE 참조 설명서:flexFlow 속성

HTML DOM STYLE 참조 설명서:flexGrow 속성

HTML DOM STYLE 참조 설명서:flexWrap 속성