img div之间差3px

今天有人问我一个奇葩的问题，从来没遇到过，搞了半天才知道原因。

事件起因：在一个div里放一个img，但下方会出现一小块空白，他想去掉。

事件经过：当时是以为是边距的简单问题，就过去通过chrom调试，调试了半天发现，当内外边距都为0时，下方还是会有3px的空白，搞不清楚只好上网搜索一下，奥！！！！！原来是浏览器解析问题。

事件结果：因为img是内联元素，div是块元素，浏览器解析时会在img下预留高度，而且火狐的是5px，谷歌的是3px（我估计是要防止内联元素撑爆块元素），知道了原因，解决起来就简单多了。直接给img变成块元素就可以了，即给其一个 dispaly:block; 属性。

感想：解决完这个问题后，突然想到以前看的书上有写，遇到img时，要将其变成块元素，当时一眼略过，也没想到那么多，哎呀，现在才感觉基础太重要了，有些东西只要你知道了他们的原理，解决起来就顺利多了，同时也知道实践的重要性的。