css - 通过将图像高度设置为容器高度，使图像适合其容器

Question

假设我有 container.a，它有一些以像素为单位的高度，假设我在 container.a 中有另一个 container.b，它是 container.a 的 80%，现在说我想将一个以像素为单位的高度的图像放入容器中.b，如何使图像成为container.b的高度，然后使用CSS保持宽度纵横比？

<div class="container.a">
  <div class="container.b">
    <img class="image.a" src="my_image.png" />
  </div>
</div>

.container.a { width: 200px; height: 300px; }
.container.b { width: 80%; height: 80%; }
.image.a { ? }

Answer 1

给图像的 100% 宽度

 .image.a{width:100%;}

Answer 2

用这个：

.image.a { height:100%; width:auto }