标准文档流
浏览器排版是根据元素的特征（块和级),从上往下，从左往右排版。这就是标准文档流。
float：left/right；
效果：元素都加浮动，后面的元素会紧跟着前面的元素并排排列。
A、 只要加了float，这个元素就会脱离标准文档流。
（第一个加了float，离了标准文档流，对于浏览器来说，第二个元素就变成了标准文档流中的第一个，于是就会把他排在第一位。而第一个依然存在，所以就会叠加。）
行级加float，就会脱离标准流，块不像块，行不像行，能设置宽高，能并排排列，display就没有任何意义了。
B、浮动的元素会紧紧贴靠在一起。
C、浮动的元素会文字环绕
使元素脱离标准流的方法：
1、浮动 （float）
2、绝对定位（position：absolute；）
3、固定定位（position：fixed；《fixed 固定的》
浮动带来的坏处
给元素加了浮动，撑不起父级的高度了
清除浮动
1、给浮动的父元素添加高度
2、给父级添加overflow：hidden；
3、给浮动元素的后面添加一个空的div 添加样式为clear：both；
4、给浮动元素的父级添加一个类叫clearfix
如：body里面
<ul class="clearfix">
<li></li>
<li></li>
</ul>
style里面是
.clearfix:after{ content:"0";
display:block;
clear:both;
height:0；
visibility：hidden；}
伪类选择器
伪类选择器
只要选择器后面带：都可以说他是伪类选择器
如：
a:link{} a:hover{} a:visited{} a:active{} p:after{} p:before{}
a的四种状态：
a：link（正常的）
a：visited（访问过后的）
a：hover（鼠标悬浮）
a：active（鼠标点击的那一下）
（注：四种状态的顺序不能变）
伪元素和伪类选择器的区别
伪元素有两个冒号 如（p：：after{}）
伪类选择器有一个冒号 如（p:hover{}）