CSS Keywords

{object_name}

Content Distribution

  • space-around

    기본적으로 space-between와 동일하지만 양쪽 끝에도 형성된 간격의 1/2 간격을 각각 갖는다.

  • space-between

    정렬 대상은 정렬 컨테이너 안에서 고르게 배치된다. 첫번째 정렬 대상은 정렬 컨테이너의 시작 모서리와 같은 높이로 배치되고 마지막 정렬 대상은 정렬 컨테이너의 끝 모서리와 같은 높이로 배치된다. 나머지 정렬 대상은 시작과 끝 정렬 대상 사이에서 필요에 따라 간격이 균등하게 배분되어 배치된다.

  • space-evenly

    기본적으로 space-around와 동일하지만 첫번째 정렬 대상의 이전, 마지막 정렬 대상의 이후 간격과 첫번째 정렬 대상과 마지막 정렬 대상 사이의 간격이 정렬 컨테이너 내에서 균등하도록 배치한다.

  • stretch

    정렬 대상의 전체 차지하는 영역의 크기가 정렬 컨테이너의 크기보다 작은 경우 자동으로 비례적으로 늘려서 정렬 컨테이너에 꽉 차도록 한다.

©2024 devdic.com, Korea

출처를 밝힌 리소스 이외의 본 레퍼런스에 사용된 모든 생성물의 소유 및 저작권은 devdic.com에 있습니다. 특별히 재배포를 금지한 것 이외는 재배포가 가능하며 반드시 출처를 표기해 주시기 바랍니다.
현재는 베타 버전으로 미등록 및 불완전한 콘텐츠가 일부 있을 수 있습니다. 오류 및 기술 자료 제보(건의)는 언제든지 환영하며 감사드립니다.
기본적으로 W3C 기술 사양을 기준으로 작성하였으며 일반적이지 않은 기술 설명에 대한 내용의 일부는 Mozilla의 MDN web docs에서 도움 받았음을 밝힙니다. 그들을 존경합니다.

master@cydemy.com