CSS 내장 크기 조정에서 `min-content` 및 `max-content`는 무엇입니까?

내재 치수와 외부 치수

상자의 외부 치수는 다음에서 파생됩니다. 너비: 80%와 같은 상위 상자의 크기입니다. 이와 대조적으로 너비: 최소 콘텐츠와 같은 본질적인 크기는 상자 자체 내의 콘텐츠에 의해 결정됩니다.

최소 콘텐츠 및 최대 콘텐츠 정의

최소 콘텐츠 :

내용을 피하는 상자의 가능한 가장 작은 너비 넘칩니다.

상자 내용물이 더 좁으면 넘침이 발생합니다.

• max-content:

"이상적" " 무제한의 사용 가능한 공간을 갖춘 상자 너비.

상자는 불필요한 부분 없이 내용물을 완전히 수용할 수 있도록 확장됩니다. 공백.

최소 콘텐츠와 최대 콘텐츠는 어떻게 계산되나요?
• 최소 콘텐츠를 시각화하려면 더 넓은 포함 상자(예: #red) 내의 부동 상자(예: #red)를 고려하세요. 예: #blue):

#red의 최소 콘텐츠 너비는 #blue의 너비가 다음과 같을 때 너비와 같습니다. 0px, #red의 내용이 넘치지 않도록 합니다.

마찬가지로 max-content의 경우 #red가 매우 넓은 #blue 내에 떠 있는 것을 시각화합니다.

#blue { width: 0px; }
#red { float: left; }

max-content 너비는 #blue의 너비가 사실상 무한할 때 #red는 너비와 같으므로 #red의 내용이 완전히 확장될 수 있습니다.

추가 내장 특성

핏 콘텐츠와 신축성을 포함한 기타 고유 특성이 현재 개발 중입니다. 최종 정의 및 구현에 대한 향후 업데이트를 계속 지켜봐 주시기 바랍니다.

#blue { width: 99999999999999999px; } /* ~infinite */

위 내용은 CSS 내장 크기 조정에서 `min-content` 및 `max-content`는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!