css

造成原因:

    图片的 display 属性默认是 inline ,而这个属性的 vertical-align 的默认值是baseline。

解决办法1( 建议使用block ,  对 ie浏览器 比较友好 ):

    将 img 的 display 设置为 block

img{
    display : block ;  
}

解决方法2:

    将 img 的 vertical-align设置为middle

img{
    vertical-align : middle ;  
}

解决方法3:

  给 img 的父级容器 添加属性 overflow:hidden

.img-parent{
       overflow : hodden ; 
}

 

补充 : 

定义和用法 : 

vertical-align 属性设置元素的垂直对齐方式。

说明 :

该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中,这个属性会设置单元格框中的单元格内容的对齐方式。

默认值: baseline
继承性: no
版本: CSS1
JavaScript 语法: object.style.verticalAlign="bottom"
原文地址:https://www.cnblogs.com/500m/p/13894746.html