float 浮动
三个值:
none 默认值。元素不浮动,并会显示在其在文本中出现的位置。
left 元素向左浮动
right 元素向右浮动
inherit 规定应该从父元素继承 float 属性的值。
特性:
脱离标准文档流,摆脱块级元素与行内元素的限制。
自动贴靠,超出行宽时,下个同级元素自动找空隙贴靠。与浮动的元素高度相加超过浮动元素的前一个元素的高度时,才自动换行。
脱离标准文档流,却没有脱离文本流。碰到文本会出现被包围效果,称为字围效果。
收缩效果,如果父元素没有设置高度,父元素会变成内容宽高,如果没有内容,父元素消失。
清除浮动:
浮动的弊端:
父元素如果没设高度,父元素高度坍塌,父元素消失
导致页面结构不稳定