position和BFC

一、关于position
流定位：不能通过left/top属性来进行定位（那用什么定位），上下排列的元素纵向边距会被合并，左右元素横向边距不会合并。
浮动定位：脱离文本流，就好像不在父元素中，像是浮在父元素的上方。
相对定位：相对自身位置定位，不会脱离文本流，相当于是个参照物，给子代元素作为参照。
绝对定位：脱离文本流，不占据空间，相对于最近的有定位属性的祖籍元素定位。
固定定位：相对于窗口进行定位。

二、BFC 块级格式化上下文
BFC会阻止垂直外边距的折叠，对于的嵌套元素来说，只要将父元素设置BFC就不会和父元素的margin重叠了

（这么牛X怎么实现BFC）

形成条件：
float：left/right
overflow:hidden/auto/scroll
display:inline-block
position:absolute/fixed

常见的清除浮动的方法
1、

zoom:1;

after{

    content:" ";

    display:block;

    height:;

    visibility:hidden;

    clear:left;

}

2、

zoom:1;

after{

    content:"";

    display:table;

    clear:borth;

}

清除浮动只有两种方式，一种是用clear清除浮动，二是使用父级元素形BFC。

巴特西

position和BFC

最新文章

热门文章