Properties

Properties

Editing
  • account_tree
  • bug_report

box-sizing

웹브라우저별 박스의 width, height을 계산하는 방식의 차이를 해결하기 위한 속성이다.

사용 가능한 값 타입

〈'box-sizing'〉

  • content-box | border-box
    CSS Box Sizing Module Level 3

사용되는 키워드

  • border-box

    박스의 지정된 크기는 borderpadding 포함한 크기를 갖는다.

  • content-box

    박스의 지정된 크기는 borderpadding 제외한 크기를 갖는다.

다음은 필요에 따라 일부 값을 설명하므로 표시되지 않는 값은 값 유형을 참조하라.

  • content-boxCSS3

    기본 값이며 박스에 적용된 테두리, 내부 여백 크기가 포함되지 않는다.

구문

  • box-sizing border-box;CSS Box Sizing Module Level 3
  • object.style.boxSizing = "border-box";CSS3

    자바스크립트 형식

테스트 도구

박스의 크기를 계산하는 방식에 따른 결과 테스트

버전 명세

Modules
Module NameStatusSummary
CSS Box Sizing Module Level 3

Last review date: 2022-6-13

지원 웹브라우저