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

float浮动的特性以及部分清浮动的方法

时间:2017/11/18 14:11:44 点击:

  核心提示:float浮动的特性:1、块在一排显示2、内联元素支持宽高3、默认内容撑开宽度4、脱离文档流5、阻止margin叠压浮动:使元素脱离文档流,按照指定方向发生移动,遇到父级边界或者相邻的浮动元素停了下来...

float浮动的特性:

1、块在一排显示

2、内联元素支持宽高

3、默认内容撑开宽度

4、脱离文档流

5、阻止margin叠压

浮动:使元素脱离文档流,按照指定方向发生移动,遇到父级边界或者相邻的浮动元素停了下来。

部分清浮动的方法:

1.加高度

缺点:

a.不利于维护

b.在内容不确定高度时无法使用

2.inline-block清浮动

缺点:

a.会产生空格间隙

b.无法使用margin左右居中

3.空标签清浮动

缺点:

a.必须是非内联元素

b.但凡使用到浮动都需要加个空标签

4.以浮制浮

缺点:

a.所有浮动元素的父级都要加浮动,最终加到HTML上就无法继续清除浮动了

5.

换行符

缺点:

不符合W3C规范

6.after伪类

必须配合content样式使用

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