"flex : 0 0 33 %"에서 "0 0"은 무엇을 의미합니까?

Question

나는 현재 플렉스에 대한 학습 및 부트 스트랩 4의 열 클래스에서이 줄을 보았다 해요 :

.col-md-4 { 
    flex: 0 0 33.3333%; 
} 

을 무엇입니까 두 0 0에 해당하는 속성? MDN에서

Answer 1

:

flex

이 flex-grow, flex-shrink 및 flex-basis 설정하는 약식 속성이다.

요소를 늘리거나 줄이려는 비례 인수로 생각하는 것이 좋습니다. 0 0 33%은 기본적으로 "take threeth"를 의미하며 더 이상 "성장"또는 "축소"하지 않으며 다른 요소에 비례합니다. 구체적으로

:

flex-grow

플렉스 성장 CSS 속성은 플렉스 항목의 플렉스 성장한다 계수를 지정합니다. 그것은 아이템이 차지해야하는 플렉스 컨테이너 내부의 공간을 지정합니다. flex 아이템의 flex 성장 인자는 flex 컨테이너 내의 다른 children의 사이즈에 관련됩니다.

flex-shrink

플렉스 수축 CSS 속성

는 플렉스 항목의 플렉스 축소의 비율을 지정. 플렉스 항목의 기본 너비가 플렉스 컨테이너보다 넓은 경우 플렉스 항목은 플렉스 축소 수에 따라 컨테이너를 채우기 위해 축소됩니다.

flex-basis

플렉스 기반의 CSS 속성

는 플렉스 항목의 초기 주요 크기를 지정합니다. 이 속성은 box-sizing을 사용하여 달리 지정하지 않는 한 content-box의 크기를 결정합니다.