圖片在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;
		}