div里嵌套img高度超出

在写代码的时候经常遇到这样一个问题，如果div里嵌套一个img元素且div的高度是由img的高度来撑开，那么div的高度总会比img的高度多3px

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

解决方法：

1.div设置font-size:0

<div style="font-size:0">
  <img />
</div>

2.div设置display:flex

<div style="display:flex">
  <img />
</div>

3.img设置display:block

<div >
  <img  style="display:block"/>
</div>