Make an image fit its container by setting the image height to the containers heights

£可爱£侵袭症+ 提交于 2019-12-31 00:46:09

问题


Say I have container.a and it has some height in pixels, say I have another container.b within container.a that is 80% of container.a, now say I want to fit an image that has some height in pixels into container.b, how can I make the image be the height of container.b, and then maintain the width aspect ratio using 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 { ? }

回答1:


Give 100% width of image

 .image.a{width:100%;}



回答2:


Use this:

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


来源:https://stackoverflow.com/questions/16037566/make-an-image-fit-its-container-by-setting-the-image-height-to-the-containers-he

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!