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:0;
    visibility:hidden;
    clear:left;
}

2、

zoom:1;
after{
    content:"";
    display:table;
    clear:borth;
}

 



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

原文地址:https://www.cnblogs.com/jinzhou/p/9075739.html