在css中 如何让 position:absolute 覆盖在position:relative HTML代码如下： 子DIV设置了position:absolute，父DIV设...
\u5728css\u4e2d \u5982\u4f55\u8ba9 position:absolute \u8986\u76d6\u5728position:relative HTML\u4ee3\u7801\u5982\u4e0b\uff1a\u5728aa2\u4e0a\u9762\u589e\u52a0\u4e00\u4e2acss\u6807\u7b7ez-index:
1000\u8bd5\u8bd5\u3002
\u9ed8\u8ba4\u7684\u6837\u5f0f\u4e0d\u53d8\u589e\u52a0\u4e00\u4e32z-index:1000
aa2{position:absolute;z-index:1000}
\u8fd9\u662f\u4fee\u6539\u597d\u7684\u3002\u5e0c\u671b\u80fd\u5e2e\u5230\u4f60\u3002
1\u3001\u4f5c\u4e3a\u5916\u90e8\u5bb9\u5668\u7684\u8fb9\u6846\u4e3a\u7ea2\u8272\u7684DIV\uff0c\u6ca1\u6709\u88ab\u6491\u5f00\u3002\u8fd9\u662f\u56e0\u4e3a\u5185\u90e8\u7684DIV\u56e0\u4e3afloat:left\u4e4b\u540e\uff0c\u5c31\u4e22\u5931\u4e86clear:both\u548cdisplay:block\u7684\u6837\u5f0f\uff0c\u6240\u4ee5\u5916\u90e8\u7684DIV\u4e0d\u4f1a\u88ab\u6491\u5f00\u3002
2\u3001\u5728\u5bb9\u5668DIV\u5185\u8981\u663e\u793a\u51fa\u6765\u7684float:left\u7684\u6240\u6709\u7684DIV\u4e4b\u540e\uff0c\u6211\u4eec\u6dfb\u52a0\u4e86\u8fd9\u6837\u7684\u4e00\u4e2aDIV\uff1a \u3002
3\u3001\u5728\u7528dojo\u505aDrag & Drop\u7684\u65f6\u5019\uff0c\u7531\u4e8e\u8fd9\u4e2aDIV\u662f\u5bb9\u5668DIV\u7684\u4e00\u4e2a\u5b50\u8282\u70b9\uff0c\u5982\u679c\u8fd9\u4e2a\u8282\u70b9\u88ab\u79fb\u52a8\uff0c\u5219\u4f1a\u9020\u6210\u6392\u7248\u4e0a\u7684Bug\u3002
4\u3001\u8981\u663e\u793a\u7684\u84dd\u6846\u7684DIV\u88ab\u79fb\u5230\u8fd9\u4e2aDIV\u4e4b\u540e\uff0c\u5219\u56e0\u4e3aclear:both\uff0c\u5b83\u4f1a\u88ab\u5f3a\u5236\u6362\u4e00\u884c\u663e\u793a\u3002
5\u3001\u4fee\u6539\u539f\u6765\u7684HTML\u4ee3\u7801\uff0c\u8ba9\u5916\u90e8\u7684\u5bb9\u5668DIV\u6765\u4f7f\u7528\u8fd9\u4e2aCSS\u5373\u53ef\u3002
aa2{position:absolute;z-index:1000} 这是修改好的。希望能帮到你。
用z-index
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p").click(function(){
$(this).hide();
});
});
</script>
<style>
.aa{position:relative}
.aa2{position:absolute;z-index:1;background-color:red}
.bb{position:relative}
.bb2{position:relative}
.bb3{position:absolute}
div{border:1px solid black;}
</style>
</head>
<div class="aa">aa
<div class="aa2">aa1</div>
</div>
<div class="bb">bb
<div class="bb2">bb2
<div class="bb3">bb3</div>
</div>
</div>
</html>
你指的是aa2在bb的Z轴方向之上还是Y轴方向之上？
如果是Z轴之上就给aa2一个z-index：大于bb,bb2,bb3的z-index；
如果是在Y轴之上就给aa一个高度，你看看是否符合？
你的意思是用aa2挡住 bb等3个？如果是的话，那么你给bb2一个margin-top就是了，大小等于aa的高度。
Vue实践-CSS样式position/display/float属性对比使用
扩展阅读：新手s应该怎么玩 ... 日本pisco ... 新手s入门教程 ... 新手 怎么成为s ... 新手s网调入门经验 ... passers-by ... sinαsinβ cosαcosβ ... sec5π ... 一个新手s要怎么开始 ...
