css知识点总结

css盒模型

1，css盒模型分为：IE盒模型和标准盒模型，主要表现为对于dom元素计算高度和宽度的区别上

IE盒模型：元素的宽度 = content + padding2 + border2

标准盒模型：元素宽度 = content

设置盒模型的属性：box-sizing

/*IE*/
body{
	box-sizing: border-box;
}
/*标准*/
body{
   box-sizing: content-box
}

BFC

概念

块级格式化上下位（Block Formatting context），是一块独立的渲染区域。

构成BFC的条件

1. display为inline-block,table-cell, table-caption, flex, inline-flex
2. overflow不为visible
3. float不为none
4. position为fixed或者absolute

BFC的特性

1，内置的box会在垂直方向上一个接一个的摆放
2，同一个BFC里面的box在垂直方向上会发生margin塌陷，垂直方向上的margin取决于谁的值大
3，构成BFC后不会与浮动元素重合