您现在的位置:首页 >> 前端 >> 内容

float浮动的特性

时间:2017/1/17 9:59:00 点击:

  核心提示:css中的浮动这个样式是很特殊的。了解浮动之前,一定要先了解一下什么是标准流。标准流是浏览器在解析标签时默认遵守的规则,也叫做文档流。为什么要说标准流呢?因为一般情况下(不浮动时),所有的标签都是标准...

css中的浮动这个样式是很特殊的。了解浮动之前,一定要先了解一下什么是标准流。

标准流是浏览器在解析标签时默认遵守的规则,也叫做文档流。

为什么要说标准流呢?因为一般情况下(不浮动时),所有的标签都是标准流,而浮动是一种脱离了标准流的技术。

那么现在我们再来说一下浮动的特性:

1.浮动后的元素会在排序的时候靠上对齐。

2.浮动对标准流有影响,浮动后的元素会覆盖在标准流元素的上面。

3.浮动的规则:浮动找浮动,不浮动找不浮动。

4.浮动是以自己在没有脱离标准流之前的位置为基准进行浮动的。

5.浮动会改变元素的显示方式:变为inline-block。

6.左浮动找左浮动,右浮动找右浮动。

7.文字元素会给浮动元素让位。

那么如果页面发生了浮动,我们该如何确定页面布局呢?

a.找到不浮动元素,以标准流的形式解析。

b.找到浮动的元素,以浮动的规则解析。

注:浮动后的元素所在位置是它所在的标准流的位置(它会覆盖标准流)。

Tags:FL LO OA AT 
作者:网络 来源:konglingna