float clear的css属性,关于css的float以及clear属性的理解

首先是对float属性的定义有一个整体的了解,float的定义是:float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动。浮动元素会生成一个块级框,而不论它本身是何种元素。

一个元素如果设置了float属性,则会脱离当前的普通流(即文档流),漂浮在普通流之上,具体漂浮的位置边界,与该元素的包含块以及前一个块级元素的位置有关,float之后的位置根据其值是left或是right,会与包含块的左边界或者右边界对齐(浮动元素可设置其margin值),并且不会超过上一个块级元素所占的行,同样的float元素不会重叠而是像普通流那样排列。

其次是对clear属性定义的理解,clear的定义是:clear 属性规定元素的哪一侧不允许其他浮动元素。取值可取left,right,both,none,inherit。

只看定义描述的话很容易产生歧义,因此我对此定义的理解是:

1.元素的位置由html自上而下的加载,先加载的位置不会因为后面元素类型变化导致自身位置变换。

2.设置clear属性相当于,将该元素的左侧元素或者右侧元素在位置不变的情况下变成块级元素占据一行,设置成为clear的元素的位置根据其调整。

可能只有我能看懂。。。等日后加入demo就会好理解一点了。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值