我正在将一个相当大的图像加载到父 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不是很熟悉，请指点。
最佳答案
您可以设置 width: 100%; 和固定高度 - 以像素为单位:height: --px;
关于html - 图像填充父 div 的宽度和高度，并居中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49889580/