JavaScript

[DOM_Style] JS - boxSizing 속성 - (박스너비 = 박스전체너비 =박스총너비) 결정방식 (= 박스사이징속성, IE8)

boxSizing 예제

 

<style> 

div.container {

  width: 300px;

  border: 1px solid;

}


div.box {

  width: 150px;

  border: 3px solid red;

  float: left;

  padding: 10px;

}

</style>


<div class="container">

  <div class="box" id="box1">홈짱닷컴</div>

  <div class="box" id="box2">Homzzang.com</div>

  <div style="clear:both;"></div>

</div>


<button onclick="homzzang()">클릭</button>


<script>

function homzzang() {

  document.getElementById("box1").style.MozBoxSizing = "border-box"; /* 구 Firefox */

  document.getElementById("box2").style.MozBoxSizing = "border-box"; /* 구 Firefox */

  document.getElementById("box1").style.boxSizing = "border-box";

  document.getElementById("box2").style.boxSizing = "border-box";

}

</script>

 

결과보기

 

 

 정의 

 

 

 


 

 

.

기본값: 

반환값: 를 나타내는 문자열

CSS속성: 
CSS버전: CSS

4.

브라우저 지원. 

 

 

 

 구문 

 

[접근]

 

 

[설정]


 


 

[속성값]

 

 

 



분류 제목
DOM_Style JS - borderBottomRightRadius 속성 - 테두리하단오른쪽모서리둥글게 설정/반환 (= 테두…
DOM_Style JS - borderBottomStyle 속성 - 테두리하단스타일
DOM_Style JS - borderBottomWidth 속성 - 테두리하단두께 (= 하단테두리두께 = 보더바텀위드스 = b…
DOM_Style JS - borderCollapse 속성 - 테두리겹침설정 (= 테두리중첩설정 = 테두리이중방지 = 보더컬랩…
DOM_Style JS - borderColor 속성 - 테두리색깔 설정/반환 (= borderColor속성 = 보더컬러 속성…
DOM_Style JS - borderImage 속성 - 테두리이미지 설정/반환 (= borderImage속성 = 보더이미지속…
DOM_Style JS - borderImageOutset -
DOM_Style JS - borderImageRepeat -
DOM_Style JS - borderImageSlice -
DOM_Style JS - borderImageSource -
DOM_Style JS - borderImageWidth -
DOM_Style JS - borderLeft -
DOM_Style JS - borderLeftColor -
DOM_Style JS - borderLeftStyle -
DOM_Style JS - borderLeftWidth -
58/89
목록
 홈  PC버전 로그인 일본어
그누앞단언어
그누뒷단언어
그외코딩언어
그누보드
제작의뢰
Q&A
커뮤니티
웹유틸
회원센터
홈짱닷컴 PC버전 로그인