一、浮动的概念
浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止。
由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样。
二、浮动的影响
1. 浮动会导致父元素高度坍塌
而我们需要的是下面的样式:
父元素中有子元素,并且父元素没有设置高度,子元素在父元素中浮动,结果必然是父元素的高度为0,这也就导致了父元素高度塌陷问题。浮动脱离文档流,这个问题会对整个页面布局带来很大影响,如何解决高度坍塌问题,我们需要清除浮动。
2、什么时候需要浮动 ?什么时候需要清除浮动 ?
(1)为什么需要浮动
据网上资料显示,以前提出浮动的概念主要是为了解决左边图片,右边文字的需求,后来浮动在网页的布局中应用比较广泛。我之前在学习网页设计时,针对于一个花店的导航页,存在许多的图片显示,而有效并且美观的布局样式极为重要,这时float属性就显得尤为重要。
(2)什么时候需要清除浮动
浮动的属性虽然方便使用,但是在使用这种属性时,也存在着一种弊