如何将 div 更改为响应式？

【问题标题】：How to change a div into responsive?如何将 div 更改为响应式？
【发布时间】：2015-10-01 16:04:05
【问题描述】：

我是新手，我创建了一个 div。任何人都可以建议如何将其更改为响应式视图。代码是：

    <body>
<style>
div {
  display: inline-block;
  position: relative;
  z-index : 1;
}
div img { border: 1px red solid; display: block; }
div + img { position: absolute; z-index: 100; top: 200px; right: 600px; }
</style>
<div>
 <div>
  <img src="w2.jpg" alt="" style="height: 315px; width: 851px;" />
 </div>
 <img src="w3.jpg" alt="" style="height: 160px; width: 160px;" />
 </div>
 </body>

【问题讨论】：

查看此链接会有帮助：stackoverflow.com/questions/12933356/…
您会在here 找到一些关于创建响应式网站的帮助
你必须在不同的断点处编写 CSS。 This 可能会帮助你

标签： html css

【解决方案1】：

在https://jsfiddle.net/c0vpp862/ 尝试更新后的代码，例如 sn-p

<div>
 <div>
  <img src="http://localhost/arp/isol_cms/wp-content/themes/twentythirteen/images/img/s5.png" alt="" style="height: 315px;" />
 </div>
 <img src="w3.jpghttp://localhost/arp/isol_cms/wp-content/themes/twentythirteen/images/img/s5.png" alt="" style="height: 160px;" />
 </div>

风格

div {
  display: inline-block;
  position: relative;
  z-index : 1;
}
div img { border: 1px red solid; display: block; }
div + img { position: absolute; z-index: 100; top: 200px; right: 600px; }

我刚刚删除了两个图像的宽度，如果您愿意，可以设置 width = 100% 并删除图像的高度，

【讨论】：

Thnx Arpita...该代码对我很有用...我稍作改动并使用了它...
@SyamSree 如果这解决了您的问题，请接受它作为答案。