3인칭 단수: 상자 복수형: 상자 현재 분사: boxing 과거 분사: boxed
sizing
英['saəzɑŋ] n 정렬; 크기에 따른 슬래그 분쇄;CSS3 상자 크기 조정 속성 통사론
기능: 특정 영역에 적합한 것이 무엇인지 정확하게 정의할 수 있습니다.
참고: Internet Explorer, Chrome, Safari 및 Opera는 상자 크기 속성을 지원합니다. Firefox에는 접두사 -moz-가 필요합니다.
css3의 box-sizing 속성을 사용하면 특정 영역과 일치하는 특정 요소를 특정 방식으로 정의할 수 있습니다. 여기에는 두 가지 값이 있습니다. content-box는 실제 너비가 너비, 테두리 및 패딩의 합임을 의미합니다. -box는 실제 너비를 의미합니다. 너비는 너비 값과 같습니다
CSS3 상자 크기 조정 속성 예
<!DOCTYPE html>
<html>
<head>
<style>
div.container
{
width:30em;
border:1em solid;
}
div.box
{
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
width:50%;
border:1em solid red;
float:left;
}
</style>
</head>
<body>
<div class="container">
<div class="box">这个 div 占据左半部分。</div>
<div class="box">这个 div 占据右半部分。</div>
</div>
</body>
</html>인스턴스 실행 »
온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요