标准模型 + IE模型

1. 标准模型宽高为content的宽高

   box-sizing: content-box;

2. IE模型宽高是 content + border + padding 的宽高

   box-sizing: border-box;

js如何设置和获取元素宽高

dom.style.width/height // 只能获取内联样式的宽和高

dom.currentStyle.width/height // 能够拿到最后的样式，但只有ie支持

window.getComputedStyle(dom).width/height // 能兼容

dom.getBoundingClientRect().width/height

BFC (解决边距重叠问题)

基本概念：块级格式化上下文
原理：

1. bfc垂直方向上边距会发生重叠
2. bfc区域不会与浮动元素的box重叠
3. bfc是一个独立容器，内外不会相互影响
4. 计算bfc高度时，浮动元素也会参与计算

如何创建bfc：

1. float不为none
2. position不是static或者relative
3. display设置table相关，table-cell,table-caption,or inline-block任何一个
4. overflow不为visible