div包裹图片时,底部有空隙

1.现象

div包裹图片时,底部有空隙_第1张图片

2. 原因

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

3.解决办法

分两种:

  • 设置img元素display:block 或者 vertical-align: middle;
  • 设置div元素display:flex

你可能感兴趣的:(css)