浮动的特点

一、什么是浮动

1、浮动概念：是一种布局方式，可以让元素脱离文档流，一旦元素脱离文档流

就不再具有元素在文档流中的特点，从而帮助我们布局

2、设置浮动：float样式名

可选值：

none 不浮动 默认值

left 向左浮动

right 向右浮动

3、浮动的特点

（1）、基本特点

a:一旦元素设置了浮动，元素就会脱离文档流，

它原来在文档流中位置，就没有了，后面的元素就会跑上去，顶上

b:元素设置浮动，会尽可能的向页面的左上或者右上进行浮动

c:浮动的元素不会超出它的父元素

d:浮动的元素不会超过它上一个兄弟元素，最多一边齐

e：如果浮动的元素上一个兄弟元素没有浮动，浮动元素也不会跑上去

二、浮动的特点

浮动的特点

当元素设置浮动以后，会完全脱离文档流，元素的一些特点也会发生改变

脱离文档流的特点

块元素：

1:块元素不再独占页面的一行

2:块元素的宽高默认被内容撑开，如果设置，就按设置

行内元素：

1:浮动过后的行内元素更像行内块元素,默认宽度为内容的宽度，可以设置宽高

行内块元素：

也没有图片三像素的问题

总结：当元素设置浮动以后,脱离文档流，就不需要再区分块和行内，行内块

特殊点

当浮动元素元素碰到了文字，浮动元素不会盖住文字，而文字会环绕在浮动元素

周边。从而出现一种文字环绕图片的效果，这也是浮动最早的一个作用