如何让img在固定大小的盒子中居中显示

要在HTML中的一个固定大小的`<div>`容器里让`<img>`元素垂直和水平居中，你可以使用CSS的flexbox或者grid布局，以及一些内联样式。以下是两种常见的方法：

1. 使用Flexbox布局：

<div class="container" style="display: flex; justify-content: center; align-items: center;">
    <img src="your-image-url" alt="Image description" style="max-width: 100%; max-height: 100%;"/>
</div>

这里的`.container`设置为`display: flex`使其变为弹性盒模型，`justify-content: center`和`align-items: center`分别使图片在水平和垂直方向上居中。

2. 使用Grid布局：

<div class="container" style="display: grid; place-items: center;">
    <img src="your-image-url" alt="Image description" style="max-width: 100%; max-height: 100%;"/>
</div>

在这个例子中，`.container`应用了网格布局(`display: grid`)，`place-items: center`自动将图片放置在交叉点上，实现了居中。

记得替换`your-image-url`为实际的图片URL，并调整`max-width`和`max-height`以保持图片适应容器。