补充
margin: 0 auto;
上下为0 左右自适应 （前提给这个元素设置宽和高）
这是常用做网页结构的居中方式
css选择器的层叠样式 （2种选择方式）
1.继承性
2.层叠性 （选择器的选择能力） 当一个内容被多种选择器选中时，浏览器会选择权重大的
层叠性的两种情况
选中时 权重问题 （权重大就选谁）权重相同 （谁在后面就选谁）
没选中 走继承性 （font/color/text）继承性的权重是0 当多个父级设置这样的样式 走就近原则 （纯标签跟 class /id没有可比性 纯class跟id没有可比性）
如果继承的两个一样近 谁更具体走谁的
标准文档流
浏览器的排版根据元素的特征（块和行级）从上往下 从左往右 （不适用于网站）
浮动 float
float:left/right 左右浮动
效果 ：元素都加浮动 后面的元素会紧跟着前面的元素排列
如果两个快一个用浮动 一个不用浮动 会出现 两个快叠加的情况
解释：只要加了float这个元素就会脱离标准文档流 浏览器便放弃了它 对浏览器而言 别的元素会替代他的位置 ，而float依然存在 所以就会叠加
优点：行级元素加了float 脱离了标准流 就会块不像块 行不像行能设置宽高能并排排列display 便失去了意义
浮动元素会并排排列互相贴靠在一起
浮动有文字环绕
拓展 ：使元素脱离标准流的方法
1.浮动 2.定位 position:absolute; 3.固定定位 position:fixed;
浮动缺点 给元素加了元素却撑不起父级的高度了
清除浮动缺点的几个方法
1.给浮动的父元素添加高度 height
2.给父级添加 overflow:hidden;
3.浮动元素后面添加一个空的<div style="clear:both"></div>
但是以上都不是常用的方法（哈哈 不要急）
介绍一种选择器 ：伪类选择器（伪元素）
p:：after{} 意思是在p的后面加一个伪元素
p:: before{} 意思是在p的前面加一个伪元素
伪类选择器 p: 伪元素p:: ( 这是他们唯一的区别)
格式 .clearfix:after{ （在标签里面设置class="clearfix" ,看个人习惯）
content:"";
clear:both;
display:block; (必写)
height:0;
visibility:hidden;
} （清除浮动最常用的方法，也是最好用的方法）
顺便说下<a>标签在伪类的用法（必须按顺序写）
a:link{} 正常的颜色
a:visited{} 访问后的颜色
a:hover{} 鼠标悬浮
a:active{} 鼠标激活（点击）
（ a:after{} a:before{} ）
不需要某种功能可以不写 ，但位置不可更改
拓展 margin: 0 auto; 和 text-align 的区别 （都是居中的意思）
margin是对自身的居中 text-align是对内部元素的居中
visibility:hidden;和display:none; 的区别 （都是隐藏的意思）
visibility 隐藏后还占着空间 display 隐藏后不占空间 （相当于删除）