CSS - 重疊 - 有效

有沒有一種有效的方法來重疊2個div。CSS - 重疊 - 有效

我有以下，但無法使它們重疊。

#top-border{width:100%; height:60px; background:url(image.jpg) 0 0 repeat-x; float:left; position:relative;} 
#header-wrap{width:100%; height:80px; background:none; float:left;} 
#header{width:800px; margin:0 auto; height:80px; background:url(taller-image.jpg) 0 0 repeat-x} 



<div id="top-border"></div> 
<div id="header-wrap"> 
    <div id="header">links go here.</div> 
</div>

這基本上給出了頂部橫幅「突出」出來但我無法讓他們重疊的效果......

如在圖像的頂部在這裏看到：http://www.boguscreek.com/images/template.jpg

來源

2010-11-08 tony noriega

位置：相對;左：-30px將在元件1

<style> 
    #div1{ 
     width:100px; height:100px; 
     border:1px solid red; 
     float:left; 
} 

#div2{ 
    width:100px; height:100px; 
    border:1px solid blue; 
    float:left; 
    position:relative; 
    left:-30px;

}

移動element2的30個像素

</style> 

<div id="div1">1</div> 
<div id="div2">2</div>

來源

2010-11-08 22:24:05 FatherStorm

我想在這裏得到這個效果在網站的頂部：http://www.boguscreek.com/images/template.jpg – 2010-11-08 22:28:21

類似於重疊的我的圖像模板看到的都是褐色的吧，但你並不需要使用重疊<div>的做這件事，只是圖像與棕色的酒吧和藍色的唯一的事馬賽克作爲<body>的背景圖片，並將所有內容放在<div>的內部。

來源

2010-11-09 00:34:46

我想避免巨大的圖像文件，寧願使用較小的圖像重複-X。 – 2010-11-10 17:22:31

我認爲，你仍然可以使用我用平鋪圖像描述的方法。 – 2010-11-11 00:44:57

CSS - 重疊 - 有效

回答

相關問題