CSS力格与绝对位置落后格与静态位置

因此，可以说，我有一些文件CSS力格与绝对位置落后格与静态位置

 #a{width: 10px; height: 10px; background: red; z-index: 10;} 
 
     #b{width: 100%; height: 100%; background: black; z-index: 5; position: absolute;}

<body> 
 
     <div id="a">foo</div> 
 
     <div id="b">bar</div> 
 
    <body>

的#b div覆盖#a，因为#b有absolute位置。

我怎样才能力#b在#a而不改变#a位置？

来源

2017-02-21 Coffee

您可以将position: relative添加到#a元素。

来源

2017-02-21 13:59:13

是的，我在发布问题后发现它，我的坏）谢谢 – Coffee

#a {width：10px; height：10px;背景：红色; z-index：10;位置：相对} –

你必须设置比static一个其他position你的第一个div申请喜欢z-index

#a { 
 
    width: 100px; 
 
    height: 100px; 
 
    background: red; 
 
    z-index: 10; 
 
    position: relative; 
 
} 
 

 
#b { 
 
    width: 100%; 
 
    height: 100%; 
 
    background: black; 
 
    z-index: 5; 
 
    position: absolute; 
 
    left:0; 
 
    top:0; 
 
}

<div id="a">foo</div> 
 
<div id="b">bar</div>

来源

2017-02-21 14:00:39 Sebastian

样式您应该添加一个相对位置，你的第一个div：

<body> 
    <div id="a">foo</div> 
    <div id="b">bar</div> 
<body> 
<style> 
    #a{width: 10px; height: 10px; background: red; z-index: 10; position:relative} 
    #b{width: 100%; height: 100%; background: black; z-index: 5; position: absolute;} 
</style>

来源

2017-02-21 14:00:43 Ayyoub

CSS力格与绝对位置落后格与静态位置

回答

相关问题