html z-index 中的图像标签可以放在 css 背景图像后面吗？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6019488/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Can a image tag in html z-index behind a css background image?
提问by Dennis Martinez
I have a css background image that I want in front of my img tag. The css background image has a z-index of 1, and the img tag has a z-index of 0. Am I aloud to put an img tag behind the css background with the z-index or will a css background always be behind an img tag regardless of it's z-index?
我有一个 css 背景图片，我想要在我的 img 标签前面。css 背景图像的 z-index 为 1，img 标签的 z-index 为 0。我是大声将 img 标签放在带有 z-index 的 css 背景后面，还是 css 背景总是在img 标签，而不管它是 z-index 吗？
回答by DanielB
Sure, a HTML element with a background-imageand a higher z-indexcan overlay any other HTML element, in your case a simple <img />tag. But the <img>tag has not to be nested within the tag holding the background image.
当然，带有 abackground-image和更高的z-indexHTML 元素可以覆盖任何其他 HTML 元素，在您的情况下是一个简单的<img />标签。但是<img>标签不必嵌套在包含背景图像的标签中。
This will work
这将工作
<img src="../image.jpg" />
<div style="background: url(../image2.gif); z-index: 1">Content</div>
this not:
这不是：
<div style="background: url(../image2.gif); z-index: 1">
<img src="../imag.jpg" />
</div>
回答by antk3
It works if you set position to either relative or absolute. Be sure to set it as it may just be inherited.
如果您将位置设置为相对或绝对，它就会起作用。一定要设置它，因为它可能只是被继承。
回答by Daniel Ruf
use 2 divs with a background image or the divs and set each div / image the z-index
使用 2 个带有背景图像或 div 的 div 并将每个 div/图像设置为 z-index
回答by DevZarak
Would be useful if you could show some code to understand what you want to do. If you only want to display an image in front of another, use 2 Containers like Div, or Span..
如果您可以显示一些代码来了解您想要做什么，那将会很有用。如果您只想在另一个图像前面显示图像，请使用 2 个容器，例如 Div 或 Span..
<div id="image1">
<span id="image2"></span>
</div>
