项目中的img标签：
本文是在项目中遇到img标签的相关问题，并且顺便重新总结了一下img标签相关只是和采坑的知识，以便日后学习和查阅。
问题与解决方法：
制作海报背景时由于特殊需要所以需要img标签作为背景使用。
项目页面结构为上下结构，上为tab切换不同背景。下为背景图片。
项目运行后在常见浏览器中打开显示没有问题，但是在微信浏览器中打开后发现，tab和背景图片中间有4个像素的留白缝隙。通过见检查并没有发现有border或者margin属性。最后解决办法是给img标签设置css样式，相对定位，让图片在微信浏览器打开后向上移动top:-4px;成功解决问题。
导致问题原因：
经过分析可能是由于微信自带浏览器兼容问题，导致页面中的各个元素之间的定位导致tab向下整体移动了。
img其它问题：
img 图像底部留白的原因以及解决方法
1、在有些浏览器中打开就会出现图像底部留白
原因：由于img元素默认为inline元素，而inline元素的vertical-align属性的默认值为baseline文字基线对齐，正好图片底部的留白就是baseline和元素下边界的距离，有的小伙伴可能不清楚vertical-align所一张图可能就明白了：
解决方法（亲测可用）：
1、父元素设置font-size
2、img设置浮动、img改位块级元素、将元素的垂直对齐方式改为居中
div{
font-size: 0;
}
div img {
float: left;
display: block;
vertical-align: middle;
}
<div>
<img src="1.png">
<img src="2.png">
</div>
新年第一篇，有点晚，哈哈哈哈！！！欢迎交流前端知识，指正不足。