1.利用display:table-cell,具体代码如下:
html代码如下:
<div class="img_wrap"> <img src="wgs.jpg"> </div>
css代码如下:
.img_wrap{ 400px; height: 300px; border: 1px dashed #ccc; display: table-cell; //主要是这个属性 vertical-align: middle; text-align: center; }
2.采用背景法:
html代码如下:
<div class="img_wrap"></div>
css代码如下:
.img_wrap{ 400px; height: 300px; border: 1px dashed #ccc; background: url(wgs.jpg) no-repeat center center; }
效果如下图: