Html 图像填充父div宽度和高度以及中心

我正在将一个相当大的图像加载到父div中，我的

pug

代码如下：

a.eventlist-column-thumbnail.content-fill(href=`${link}`)
    img(src=`${img_src}`, alt=`${img_src}`, style='position: static; float:left; width: 100%;')

这里的要点是，使用

width:100%

我能够填充父级，具有以下效果：

这并不坏，但是当您仔细观察时，您会发现图像没有填充高度，因为就纵横比而言，它比父div“更薄”

我希望在图像尽可能保守地填充宽度和高度，同时保持相对于父div居中的情况下实现此效果：

---

不太熟悉

html/css

，请给出指针。

您可以设置

宽度：100%和固定高度-以像素为单位：
高度：--px

--
尝试
对象匹配：覆盖在img标签中
问题在于，我将加载大量不同大小的图像，因此不可能出现通用的图像。根据原始图像的大小，图像的大小会有所不同。