实现图片在一个div中垂直左右都对齐

<div class="info_top_left">

        <img src="images/img-product01.png" alt="">

</div>

 

 .info_top_left {

    height: 100px;

    width: 97px;

    line-height: 100px;

    border: 1px solid #CACACA;

    float: left;

    text-align: center;

    font-size: 0;

}

.info_top_left img {

    vertical-align: middle;

}

 

解析:当要求图片在div中垂直居中时,由于没有字，所以默认所有的线都在第一行，设置height等于line-height

可以让所有的线居中，再设置font-size的话所有都会重叠，再设置vertical-align：middle的话，即可。