CSS中BFC（还有margin-top和top）

1.前置知识介绍

HTML中常用布局方式：
1.标准流/普通流
2.浮动布局
3.定位布局
4.弹性布局

块级元素：div、H1-H5、p、table、ol/ul/li

内联元素（可置换/不可置换）：a、span、img、input

margin-top和top附注：

top/right/bottom/left和margin-top/margin-right/margin-bottom/margin-left都可以用在relative/absolute中，但是relative一般用margin-top/margin-right/margin-bottom/margin-left，absolute一般用top/right/bottom/left（absolute中使用margin-top是一种特殊的“相对定位”），两者的区别，可以通过查看盒模型知道。

还有一条：
1.使用top、bottom、left、right的前提是本元素position被定义为relative、absolute和fixed中的一种，不能是static
2.使用margin-top、margin-bottom、margin-left、margin-right的元素的position可以是static、relative、absolute和fixed
3.relative下right和bottom是从right/bootom方向偏移，比如

position: relative;
background: blue;
width: 100px;
height: 100px;
right: 50px;
bottom: 50px;

是从right/bottom方向偏移50px࿰