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"