在写代码的时候经常遇到这样一个问题,如果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>