四个原则

红色区域高度由内部文档流中的元素高度的整体决定
float 元素不在 normal flow里
所以红色元素不一定可以包裹住float元素
用了float就一定要清除浮动

站位问题

块级元素看不见浮动元素
内联元素会看的见让开位置

清除浮动

通过给浮动元素最后的元素进行设置,使正常流包住浮动元素

添加伪元素

parent：：after{
content:" ";
display:block;
clear:both;
}

也可以添加类

.clear{
display:block;
clear:both;
}

清除浮动后

clear清除浮动，块级元素往下跑，内联元素往左右跑

关于内联元素和块级元素的浮动（float）问题
四个原则红色区域高度由内部文档流中的元素高度的整体决定 float 元素不在 normal flow里所以红色...
css 布局
一左右布局 1.利用float，注意父级元素要清除浮动clearfix 2.利用内联块元素,注意内联元素排在一起会...
css浮动模型float问题
float模型属性 left:向左浮动 right:向右浮动 float模型需要注意的几点块级元素和行内元素（行...
7、浮动样式与BFC常见方法
display:inline-block; // 内联块 float：浮动 BFC：就是清浮动，用来处理元素脱离...
css 元素分类
块级元素内联元素（行内）内联块级元素块级元素等display:block inline 内联原素内联块级元素
CSS布局（inline和block）
CSS内联元素和块级元素, 内联块级元素 HTML语言标签元素被分为三种类型: 内联元素(行内元素), 块级元素,...
基础必备之float
特性：float使块元素对外呈现内联元素的特性，对内呈现块元素的特性，浮动元素脱离文档流（1）文字环绕效果给p...
浮动。box
盒子样式内边距：padding 外边距：margin 外边距重叠：浮动：float 内联元素浮动：内联元素盒模型：
CSS常见布局以及一些小技巧
左右布局 float浮动可以将左边和右边的块级元素都设置为float:left；可以将左边的块级元素设置为fl...
浮动模型
浮动：float: left / right ; 浮动元素产生了浮动流：1.所有产生了浮动流的元素，块级元素看不到...