关于div包裹img，底下多出3px间隙的问题

背景：昨天写过一个div包裹图片的html，已经reset了所有的div，但还是发现img与div底部会有3px的间距，我检查了所有的css，发现并未发现什么问题，结果度娘了一下，发现好多朋友都遇到了这个问题，先找到解决方案再说，伟大的网友提供了3中解决方案：

方案一:div{font-size:0};

方案二:img{ display:block};

方案三:img{vertical-align:top;}

其实还有一种 div{ margin-bottom:-3px };

问题是解决了，但我是好奇宝宝，不知道是什么原因，于是今天再次度娘

 

img是一种类似text的元素，在结束的时候，会在末尾加上一个空白符，所以就会多出3px。

希望对大家有所帮助，记录下来只为了自己也能记住