css定位z

编程入门 行业动态 更新时间:2024-10-11 01:17:19
本文介绍了css定位z-索引负边距的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述

我有以下html - 无论我怎么样,我似乎不能得到中间的div出现在顶部和顶部的底部。它坐在上面的顶部,但在那里我会期待底部坐在中间,底部实际上坐在上面。有任何想法吗 ?下面的Jsfiddle链接...预先感谢!

I have the following html - no matter what i do I cant seem to get the middle div to appear on top of the top and also on top of the bottom. It sits fine above the top but where i'd be expecting the bottom to sit below the middle the bottom actually sits on top. Any ideas ? Jsfiddle link below also .. thanks in advance !

<body> <div> <div id="tdiv" >Top Div</div> <div id="connector">Middle Didv</div> <div id="bdiv">Bottom Div </div> </div> </body> #tdiv{ height:200px; border:10px dotted black ; margin-bottom: -100px; background:red; } #connector{ height:200px;border:10px solid black; background:blue; margin-bottom: -100px; z-index: 21; } #bdiv{ border:21px dashed black; height:200px; z-index: 1; background:green; }

jsfiddle/EWkMA/29/

推荐答案

z-index 在静态定位元素上是无用的。尝试 position:relative 。如果负边距无法解决,请使用 top 或底部和负值。

z-index is useless on a static positioned element. try position:relative. if negative margins don't work out for you, use top or bottom and negative values.

更多推荐

css定位z

本文发布于:2023-11-24 23:33:14,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1627354.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:css

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!