標準のCSSボックスモデルとモデルの比較IE取得したカセットのサイズを設定

CSSボックスモデルが含ま：
コンテンツ配信+パディングパディング+ボーダーボーダー+マージンマージンを

1.標準モデルとモデル比較IE

• 標準/ W3Cボックスモデルが含まレンジmargin、、 、、border およびそれが他の部品を含んでいません。paddingcontentcontent

• IEボックスモデルの範囲も包含されmargin、、 、、border 標準ボックス異なる、ボックスIEが含まと部分。paddingcontentcontentpaddingborder

  標準モデルと2.CSS IEモデルを設定する方法

  次の構文により、

box-sizing:border-box || content-box || inherit

• 使用する場合content-boxする場合：標準パターンを解決するためのページが算出され、content-boxデフォルトのモードです。
• 使用するとborder-box、ページモードは、IE解析計算を使用します。

• ときinherit時間：親から継承したページの要素box-sizingの値。

  3.JS設定取得ボックスモデルの幅と高さに対応します

  CSSを追加するには、3つの方法について：CSSのインラインスタイル、増加した<style>ノード外のスタイルシートを。以下の方法があります。
• dom.style.width/height：インラインスタイルの唯一の幅と高さ、具体的な削除を例に。
• dom.currentStyle.width/height：リアルタイムシステムのスタイルを取得し、リアルタイムレンダリングは、実行した結果であるが、唯一のIEをサポートしています。
• window.getComputedStyle(dom).width/height：また、リアルタイムで計算されたスタイルを取得し、そのようなChromeとFirefoxの、より良い互換性などの他のブラウザをサポートしています。

• dom.getBoundingClientRect( ).width/height：計算ページ上のボックスモデルの絶対位置、それはほとんど使用されません。
  詳細については、を参照してくださいここに。
  「余白重なり、BFCは」を参照してくださいここに。