Html 将元素完全置于背景之上

我有三个元素，我想保持在同一个地方作为图像响应收缩

主要的 { 位置：相对位置； } 容器 { 显示：内联； } 指向 { 显示：内联； 位置：绝对位置； 最大宽度：15%； 右边距：10px； 填充：3px7px 3px5px； 字体大小：12px； 字体大小：粗体； 颜色：fff； 背景：ff0000； 边界半径5px； 盒形阴影1px 2px 5px rgba0,0,0.5； } 一 { 最高：40%； 左：10%； } 二 { 最高：50%； 左：40%； } 三 { 最高：75%； 左：20%； } 1. 2. 3. 将容器设置为相对位置，并在其上设置高度和宽度，因为容器的子对象是绝对的。同时使你的图像绝对正中，排名前0。请参阅代码片段

容器 { 宽度：480px； 高度：360px； 位置：相对位置； z指数：100； 位置：相对位置； } .主img{ 位置：绝对位置； 顶部：0；} 指向 { 显示：内联； 位置：绝对位置； 最大宽度：15%； 右边距：10px； 填充：3px7px 3px5px； 字体大小：12px； 字体大小：粗体； 颜色：fff； 背景：ff0000； 边界半径5px； 盒形阴影1px 2px 5px rgba0,0,0.5； } 一 { 最高：40%； 左：10%； } 二 { 最高：50%； 左：40%； } 三 { 最高：75%； 左：20%； } 1. 2. 3.

---

我相信你希望它也能随着图像的缩小而相应地缩小，这样就达到了这个效果

.包装纸{ 位置：相对位置； 显示：内联块； } .wrapper img{最大宽度：100%；} 指向 { 位置：绝对位置； 最大宽度：15%； 右边距：10px； 填充：3px7px 3px5px； 字体大小：12px； 字体大小：粗体； 颜色：fff； 背景：ff0000； 边界半径5px； 盒形阴影1px 2px 5px rgba0,0,0.5； } 一 { 最高：40%； 左：10%； } 二 { 最高：50%； 左：40%； } 三 { 最高：75%； 左：20%； } 1. 2. 3.

---

设置img标签的宽度和高度

主要的 { 位置：相对位置； } 容器 { 显示：内联； } 指向 { 显示：内联； 位置：绝对位置； 最大宽度：15%； 右边距：10px； 填充：3px7px 3px5px； 字体大小：12px； 字体大小：粗体； 颜色：fff； 背景：ff0000； 边界半径5px； 盒形阴影1px 2px 5px rgba0,0,0.5； } 一 { 最高：40%； 左：10%； } 二 { 最高：50%； 左：40%； } 三 { 最高：75%； 左：20%； } img{ 宽度：100%； 身高：100%； } 1. 2. 3.

---

这太奇怪了！它可以单独工作，但当我对现有代码应用修复程序时，它仍然不起作用。哦，好吧，我想我需要做更多的修补。赢家是你！检查浏览器中的“开发工具”，并再次检查包装器元素是否有位置：相对和显示：内联块，因为这是使其工作的关键。@DeepakYadav我回滚了您的编辑，因为它不合适。像这样的编辑；试图纠正这个问题；不受欢迎，因为他们改变了实际问题。如果您还有其他问题或疑问，请在meta上询问。@FélixGagnon Grenier无问题兄弟。如果你觉得不合适。这可能是有原因的。没关系。谢谢你这么做：@DeepakYadav太棒了！回顾你的历史，我意识到这确实不是你的习惯。cheers@felixthanx bud。。我今天将为此干杯：-