CSS垂直居中几种方式

css实现水平居中的方法

<div class=”center1”></div>

<style>

.center1{

width:100px;

height:100px;

margin:0 auto;

}

.center2{

width:100px;

height:100px;

position:absolute;

left:50%;

margin-left:-50px; /*该值是宽度的一半*/

/*top:50%;

margin-top:-100px;*/

/*加上上面注释代码可以实现水平垂直居中*/

}

.center3{

width:100px;

height:100px;

postion:absolute;

left:0;

right:0;

margin:auto;

/*top:0;

bottom:0;*/

/*加上上面注释代码可以实现水平垂直居中*/

}

</style>