如何把容器放在另一个div上

我找不出为什么我的容器显示在屏幕的底部。我知道这有两个可能的问题。最好的方法是：如何将遮罩应用于背景图像，这样我就可以将图像的url粘贴到背景上，然后我可以在上面播放代码。另一个问题是：如何在没有绝对定位的情况下将conatiner div显示在背景div上。对不起，如果这是令人困惑。这里是我的代码如何把容器放在另一个div上

<html> 
<head> 
<title> 
Singapore - gallery 
</title> 
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" /> 
<meta name="viewport" content="width=device-width, initial scale=1.0"> 
<style> 
* { 
    margin: 0; 
    padding: 0; 
} 
#background img { 
    width: 100%; 
    -webkit-mask-image: 
    -webkit-gradient(linear, left top, left bottom, 
    from(rgba(0,0,0,1)), to(rgba(0,0,0,0))); 
    z-index: -1; 
} 

#container { 
    width: 1000px; 
    background-color: #fff; 
    margin: 0 auto; 
    border: 3px solid #eee; 
} 

</style> 
</head> 
<body> 
<div id="background"> <img src="gallery.jpg" /> 
<div id="container"> 
<h1> Singapore Gallery </h1> 
</div> 
</div> 
</body>

来源

2012-11-18 user1815176

的逻辑是这样的

让父DIV position: relative;，使覆盖DIV为position: absolute;和使用top: 0;

因此，这里使用的是img标签肯定没有定位所以你要做的是

我假设你想覆盖h1在你的img所以使用position: relative为#background，比使用position: absolute;为img，使之top: 0;和z-index: 1; /*Optional*/，后来让#container为position: absolute;和使用top: 0;和z-index: 999; /*Compulsory*/

来源

2012-11-18 20:00:35

谢谢！我确实在#background img中使用了你的位置绝对top 0的建议，但我把z-index设置为-1，比我不需要对conatiner div做任何事 – user1815176

@ user1815176取决于你想要的方法去，因为你理解我解释你:) –

如何把容器放在另一个div上

回答

相关问题