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力格與絕對位置落後格與靜態位置

回答

相關問題