图片在DIV里边水平垂直居中

图片在一个DIV中要垂直水平居中，首先定义一个DIV

.wrap{ width: 600px;
       height: 400px;
       border: 1px #000 solid;
      }

插入图片

       <div class="wrap">
	    <img src="../img/img2.png" alt="">
       </div>

水平居中 在图片的父元素中用text-algin:center;进行水平居中

.wrap{ width: 600px;
       height: 400px;
       border: 1px #000 solid;
       text-algin:center
      }

垂直居中

    1.在图片前或者后定义一个span元素，给span添加声明width:0;height:100%;display:inline-block;
    2.给span转换成inline-block类型，并添加vertical-algin:middle中线对齐
    3.g给图片img添加添加vertical-algin:middle中线对齐

/*图片前面定义一个span标签*/
<span></span><img src="../img/img2.png" alt="">

/*span居中*/
	.wrap span{
		width: 0px;
		height: 100%;
		display: inline-block;
		vertical-align: middle;
		}

/*图片居中*/
         .wrap img{
		vertical-align: middle;
		}