图片和行内块元素默认底线会和父级盒子的基线对齐，因此就会产生白色缝隙。
1.用vertical-align:middle | top| bottom等，让图片不和基线对齐。
上面3中对齐方式都可以
vertical-align不影响块级元素中的内容对齐，它只针对于行内元素或者行内块元素，特别是行内块元素， 通常用来控制图片/表单与文字的对齐。
2.将img通过display: block转为块级元素。
转为块级元素之后，就不存在和父级盒子基线对齐的问题了。
inline-block本身会自带空隙或者block块级元素和其他元素之间因为空白而产生间隔。
容器设置font-size:0子容器再设置font-size即可
如：
html结构举例：<div id="box">
<div>后面的span换行有空隙可根据下面的css设置修正</div>
<span>测试</span>
</div>
css举例：
#box{font-size:0}
#box div{font-size:14px}
#box span{font-size:12px}
去除css导航条菜单中间有缝隙的方法：看body加上如下代码就可以了。
body{
margin: 0px
padding: 0px
}
扩展：
body,div, form, img, ul, ol, li, dl, dt, dd, form, p {
margin: 0px
padding: 0px
border: 0px none
list-style: none outside none
text-decoration:none
}
一般网站设计都会加上上面这段代码，学习前端一定要多看其他优秀网站的布局以及页面结构。
