如何将静态div放在绝对位置div的顶部? [英] How to put a static div on top of an absolute position div?
问题描述
我正在建立一个小型的网路应用程式。
我有两个div。一个是绝对的,另一个是静态的。
我试图将我的静态div放在我绝对的顶部,所以它仍然是最上面的项目。
非常简单代码示例:
如何做到这一点?
编辑:
我一直在使用z-index。它似乎没有效果。
z-index
//reference.sitepoint.com/css/z-index\">此页:
此属性指定堆栈$位置值为
的框的b $ b级别绝对
,固定
或相对。
code>,而是可以使用 z-index
来确定顺序。
position:relative
定位元素相对于其默认(静态)位置,因此如果不指定顶部,底部,左侧或右侧,则 static
和相对
之间没有区别您可以使用 z-index
将元素向上移动。
编辑:根据您的代码示例, 这是一个有效的演示 。
编辑2:根据Nathan D. Ryan在下面的评论中的建议,您还可以应用一个否定的 z-index
到你绝对定位的div。这会将它移动到没有定义的 z-index
的页面上的一切。
I am building a small web application. I have two divs. One is absolute and the other is static. I am trying to position my static div on top of my absolute one, so that it remains the top most item.
Very simple Code Sample:
How can this be done?
Edit: I have been using z-index. It seems to have no effect.
z-index
doesn't apply to static
elements.
According to this page:
This property specifies the stack level of a box whose position value is one of
absolute
,fixed
, orrelative
.
If you make your div relative
instead, you can use z-index
to determine the order.
position: relative
positions the element relative to its default (static) position, so if you don't specify a top, bottom, left or right then there'll be no difference between static
and relative
other than that relative allows you to use z-index
to move your element up the stack.
Edit: based on your code sample, here's a working demo.
Edit 2: based on Nathan D. Ryan's suggestion in the comments below, you could also apply a negative z-index
to your absolutely-positioned div. This would move it behind everything else on the page that didn't have a lower z-index
defined.
这篇关于如何将静态div放在绝对位置div的顶部?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!