目录
1.浮动属性(float)
content
1.浮动属性(float)
- float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像，使文本围绕在图像周围，不过在 CSS 中， 任何元素 都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。
- 浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。由于浮动框不在文档的普通流中，所以文档的普通流中的 块框 表现得就像浮动框不存在一样。
用法
float:left|right|none|inherit;
| 值 | 描述 |
|---|---|
| left | 元素向左浮动。 |
| right | 元素向右浮动。 |
| none | 默认值。元素不浮动，并会显示在其在文本中出现的位置。 |
| inherit | 规定应该从父元素继承 float 属性的值。 |
浮动的特点
- 脱离原文档流，浮动范围是父级盒子内部
- 浮动的元素不参与父容器高度的计算
- 元素浮动之后变为inline-block元素
- 只有水平浮动，没有垂直浮动
- 正常文档流中的块级元素会无视浮动的的元素进行布局
- 行内元素不会忽视浮动的元素，因为行内元素不能设置宽高，但内容受限于行框
- 浮动元素会贴着父容器边框或其他浮动元素的边框
浮动会参生的问题
- 父容器高度塌陷