8조의 initial value 모음집^_^ ( 더 고급진 CSS실력을 위해 함께 해보아요 )
flex-basis: auto;
/* 플렉스 아이템의 초기 크기를 지정합니다. auto => 콘텐츠 크기에 따라 */
CSS
복사
position: static;
/* 문서 상에 요소를 배치하는 방법을 지정합니다. static => 기본 흐름대로*/
CSS
복사
flex-shrink: 1;
/* flex-item 요소의 크기가 flex-container 요소의 크기보다 클 때 flex-shrink 속성을
사용. 설정된 숫자값에 따라 flex-container 요소 내부에서 flex-item 요소의 크기가 축소됨.
initial value값이 1이므로 정의하지 않아도 자동으로 아이템이 축소되어 적용된다는 것을
주의합시다. 자동으로 아이템 너비가 축소되지 않도록 하려면 flex-shrink: 0; 해주기!!*/
CSS
복사
align-items: normal;
/* 상황에 따라 계산되는 값이 다름. flex-item일 경우 stretch로 계산되어짐!! */
CSS
복사
overflow: visible;
/* 요소의 컨텐츠가 너무 커서 요소의 블록 서식 맥락에 맞출 수 없을 때의 처리법을 정함.
다른 방법에는 잘라내기, 스크롤바 노출 등이 있음! */
CSS
복사
display: inline;
/* 요소를 inline 요소처럼 표시합니다. 앞뒤로 줄바꿈 되지 않음!! */
CSS
복사
justify-contents: start;
/* flex container에서는 주축을 기준으로, grid container에서는 인라인 축을 기준으로 어떻게 정렬할 것인지 정의하는 속성. */
CSS
복사
flex-grow: 0
/* flex-container에 공간이 남을 경우 flex-item의 flex-basis크기가 얼마나 더 할당 가능한지
나타내는 속성. Flex Item들이 일정 비율의 크기를 갖게 하고 싶을 때 많이 사용!! */
CSS
복사
vertical-align: baseline;
CSS
복사
object-fit: fill;
CSS
복사
background-color: transparent;
CSS
복사