第一：默认static属性的元素

直接给个宽度，然后设置

marign:0 auto

//上、下为0 ，左右自动

.static{

width:200px;

height: 200px;

margin: 0  auto;

background-color: #FF0000;

}

第二：浮动元素的居中

浮动的元素，margin: 0  auto;不能起作用

我们可以给浮动的元素一个position:relative,

此时可以看到上方加了一个positon

这个时候就可以通过left:50%,top:50%;就可以实现相对于浏览器居中，如果我们要想相对于父元素来进行居中的话，我们需要设置marign的值来进行调整（根据实际的情况）

如上面的图，距离左边为300px；

此时有一个父元素width为600px，高度为400px；

计算公式：（父元素的width-子元素的宽）-根据图上的宽的边距

（注意：这个父元素是没有设置元素浮动的！！！）

width:200px;

height: 200px;

float:left;

/* margin: 0  auto; *//* (不能起作用) */

background-color: blue;

positon:relative;

left:50%;

top:50%;

marign:0;(先设置为0，根据实际的情况再来计算)

第三种是让绝对定位的div居中

设置属性：

width:200px;

margin: 0 auto;

top:0;

left:0;

bottom: 0;

right: 0;