Html 调整上图的大小与调整下图的大小相同

我让我的网站反应灵敏，在所有设备上都会很好看。我有一张图片，如果有必要，它会缩小。然而，它上面的图像是它的信息，而不是。它在所有浏览器大小下都是相同的大小。此外，当浏览器减少时，上面的图像将移出div容器

HTML:

---

设置图像的高度和宽度。以及图像标记的css样式规则（或为其添加类）

img{高度：自动；宽度：100%}

您想要实现什么目标？

<div id="bears">
   <img src="./pics/bearone.jpg">
   <div id="text">
     <img src="./pics/bearinfo.png">
   </div>
</div>

#bears img {
  width: 100%;
  height: 100%;
  display:block;
 }

#bears{
    margin-top: -40px;
    width:100%;
    height:100%;
    position: relative;
  }

#text { float: right; margin-right: 750px; }
#text img { max-width: 50%; height: auto; margin-top: -55%; position: absolute;}

<div id="bears">
   <img src="bearimage.jpg" width="200px" height="10px">
   <div id="text">
    <img src="bearimagetextimage.jpg" width="200px" height="10px">
   </div>
</div>
<style> img { height:auto;width:100%} </style>