关于浮动的认识

在这之前首先要知道什么是标准文档流

1.在web页面中, 我们无法像设计软件制图一样, 想画哪里就画哪, 这因为web页面制作是一个流, 必须从上而下制作,

2.在web页面制作中, 我们将这种流, 称为标准文档流; 并且还具有一些特征：

a)　空白折叠现象

b)　高矮不齐, 底边对齐

c)　有的标签只有在一行写不下, 才会自动换行

d)　还分有的标签会自动换行

浮动是css中, 从事布局工作的, 使用最频繁的属性

浮动的元素脱标;

脱标就是去除标准文档流的限制, 比如:

1.浮动的元素可以并存一行;

2.并且可以设置宽和高（行内元素也可以）

 ##

浮动的理解:

其实浮动一开始的意义是文本围绕图片，也就是我们常说的文字环绕效果。

我们的理解: 一个元素, 当添加浮动属性, 他就到了上一层画布, 如果是left则往左飘, 但是有一个方向是默认的, 是向上;

一般情况下，如果浮动元素前定义了一个兄弟元素，那么浮动元素换行显示。

浮动脱标, 脱标之后, 就不占有标准文档流的空间,

注意: 一个浮动的标签的结构之前有个标签是标准文档流, 则无论如何, 都不会覆盖该标准文档流标签!

 ##

相同方向的浮动元素会互相贴靠

连续浮动的元素, 只要有足够的空间, 会相互贴靠, 没有足够的空间, 则再起一行

 结构：