1、定位
1、绝对定位 absolute
2、相对定位 relactive
3、固定定位 fixed
脱离文档流:排版的基础就是要脱离文档流:1 浮动,2 绝对定位,3固定定位
脱离文档流后果:父元素无法被撑开;
绝对定位的盒子由于脱离了文档流,不能用margin:0 auto(标准的文档流中)了
float会把浮动元素变成块级元素,(行内元素是无法设置宽高的,浮动之后就可以了);
2、如何清楚浮动?
1、给浮动元素的父元素加具体的高度
2、在需要清除浮动的元素设置 clear:both 属性,清除别人对我的影响,但是这个时候margin失效
3、添加overflow:hidden触发了BFC,父亲能被浮动的子元素撑开高度,(也是实际工作中常用到的方法)、
3、BFC触发的条件
1 float:left;
2 position:absolute/fixed
3 overflow:auto/hidden
4<html>根元素
5display:inline-block/table-cell
BFC的特性:
1. 属于同一个BFC的两个相邻Box的margin会发生折叠,不同BFC不会发生折叠
2. BFC的区域不会与浮动元素的区域重叠
3. BFC的高度包含浮动子元素的高度(不包括宽度)
4. BFC在页面上是一个独立的容器,里外的元素不会互相影响