스타일 플렉스 속성
예시
내용에 관계없이 모든 유연한 항목의 길이를 동일하게 유지합니다.
for (i = 0; i
y[i].style.flex = "1";
}
정의 및 사용
flex 속성은 동일한 컨테이너 내의 나머지 유연한 항목을 기준으로 항목의 길이를 설정하거나 반환합니다.
flex 속성은 flexGrow, flexShrink 및 flexBasis 속성의 약어입니다.
참고: 요소가 유연한 항목이 아닌 경우 flex 속성은 효과가 없습니다.
브라우저 지원
Property | |||||
---|---|---|---|---|---|
flex | Yes | 11.0 10.0 msFlex |
Yes | 9.0 | Yes |
통사론
flex 속성을 반환합니다.
object.style.flex
flex 속성을 설정합니다.
object.style.flex = "flex-grow flex-shrink flex-basis|auto|initial|inherit"
속성 값
Value | Description |
---|---|
flex-grow | A number specifying how much the item will grow relative to the rest of the flexible items |
flex-shrink | A number specifying how much the item will shrink relative to the rest of the flexible items |
flex-basis | The length of the item. Legal values: "auto", "inherit", or a number followed by "%", "px", "em" or any other length unit |
auto | Same as 1 1 auto. |
initial | Same as 0 1 auto. Read about initial |
none | Same as 0 0 auto. |
inherit | Inherits this property from its parent element. Read about inherit |
기술적 세부 사항
기본값: | 0 1 자동 |
---|---|
반환 값: | 요소의 flex 속성을 나타내는 String |
CSS 버전 | CSS3 |
관련 페이지
CSS 참조: flex 속성
HTML DOM STYLE 참조: flexBasis 속성
HTML DOM STYLE 참조: flexDirection 속성
HTML DOM STYLE 참조: flexFlow 속성
HTML DOM STYLE 참조: flexGrow 속성
HTML DOM STYLE 참조: flexShrink 속성
HTML DOM STYLE 참조: flexWrap 속성
❮ 스타일 개체