Html div 容器上的图像
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7064779/
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
Image over div-container
提问by shub
How can I overlap the message strip with the div?
如何将消息条与 div 重叠?
The position of the div "nav" must be fixed.
div "nav" 的位置必须是固定的。
<img src="images/diagonal_corner_message_strip.png" id="copyright" /><div id="nav">
<ul>
<li><a class="top" href="#top"><span></span></a></li>
<li><a class="bottom" href="#bottom"><span></span></a></li>
<li><a>List</a></li>
<li><a>Create</a></li>
</ul>
</div>
#nav {
padding: 6px 0;
border-bottom:1px solid #ddd;
position:fixed;
width:100%;
top:0px;
left:0px;
right:0px;
margin:0;
background:#fff url(../images/navigation/nav.png) repeat-x center left;
z-index:999999;
}
img#copyright {
position:absolute;
top:0px;
left:0px;
right:0px;
float:left;
}
Thanks a lot!
非常感谢!
回答by Kokos
The z-index
of #nav
is set to 999999
.
该z-index
的#nav
设置为999999
。
The z-index
of img#copyright
is not set.
该z-index
的img#copyright
未设置。
The z-index
defines the order in which elements will be shown, with the highest value being shown on top. The solution to your problem is easy, give img#copyright
a higher z-index
than #nav
.
所述z-index
的元件,其中将示出,具有最高值定义的顺序被显示在顶部。你的问题的解决方案是容易的,给img#copyright
一个较高的z-index
比#nav
。