创建BFC的方式

---

一、基本概念

基本概念：标准模型 + ie模型

（1）标准模型 （宽、高）= content 的宽高
（2）ie模型（宽、高）= content 的宽高 + padding 的宽高 + border 的宽高

二、JS如何设置获取盒模型对应的宽和高

1、内联样式的宽和高：dom.style.width/height
2、渲染后的结果，只有ie支持 : dom.currentStyle.width/height
3、所有浏览器支持，和第二个原理一样，通用性更好些： window.getComputedStyle(dom).width/height
4、计算一个元素的决定位置（根据视窗-左顶点）：dom.getBoundingClientRect().width/height

三、解决盒模型边距重叠—BFC

BFC就是“块级格式化上下文”的意思，创建了 BFC的元素就是一个独立的盒子，
不过只有Block-level box可以参与创建BFC， 
它规定了内部的Block-level Box如何布局，
并且与这个独立盒子里的布局不受外部影响，当然它也不会影响到外面的元素。