박스사이즈 종합분석에 대한 자세한 설명

---콘텐츠 복원 시작---

상자 크기 조정

속성을 사용하면 특정 지역과 일치하는 특정 요소를 특정 방식으로 정의할 수 있습니다.

예를 들어 테두리가 있는 상자 두 개를 나란히 배치해야 하는 경우 상자 크기를 "border-box"로 설정하면 됩니다. 이렇게 하면 브라우저가 지정된 너비와 높이로 상자를 렌더링하고 테두리와 패딩을 상자에 넣습니다.

구문
box-sizing: content-box|border-box|inherit;

content-box: w3c 표준(기본값)

border-box: IE 기존 표준

content-box:

.test1{ box-sizing:content-box; width:200px; border:15px solid #eee; }

test1의 너비 200px은 콘텐츠의 너비를 나타냅니다. 물리적인 키도 마찬가지입니다.

border-box:

.test2{ box-sizing:border-box; padding:10px; border:15px solid #eee; 🎜>

test2의 너비 200px은 테두리의 너비를 나타내며 높이도 마찬가지입니다.

위 예시를 통해 padding-box를 이해할 수 있습니다

위의 box-sizing에 대한 포괄적인 이해는 편집자가 공유한 내용의 전부입니다. , 모든 사람에게 참고가 되기를 바라며, 또한 모든 사람이 PHP 중국어 웹사이트를 지원하기를 바랍니다.

박스사이징 관련 기사에 대한 보다 자세하고 종합적인 분석을 원하시면 PHP 중국어 홈페이지를 주목해주세요!