位置絕對元素前面的相對元素CSS

我被困在一個問題中，我想顯示絕對元素前面的相對元素，我知道z-index不適用於相對元素。我怎樣才能顯示在地帶前面的圖像。位置絕對元素前面的相對元素CSS

<!DOCTYPE html> 
    <html lang="en"> 
     <head> 
     <meta charset="utf-8"> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <title>Teset</title> 
<style> 
.container { 
     width: 1170px;margin:auto 
     } 
     .footer-elements{text-align:center;bottom:0;height:15em} 
     .footer-elements .content-b{text-align:center;position:relative;height:10em} 
     .footer-elements .content-b img.main-img{text-align:center;width:18em;margin-top:-3em} 
     .footer-elements .content-b .strip-m{background:#231F20;height:9em;} 
     .footer-elements .content-b .strip-border{width:100%;height:1.3em;position:absolute;top:0;left:0%;background-size:auto 100%; 
     background:url(http://i666.photobucket.com/albums/vv22/SincerelyBerry/HAIJYNX/backgrounds/stripes.png) repeat-x;} 
</style> 
     </head> 
     <body> 

      <!-- container Start --> 
      <div class="container"> 
      <br><br><br><br><br><br><br> 
        <div class="footer-elements"> 
         <div class="content-b"> 
          <div class="strip-m row"> 
           <div class="strip-border"></div> 
           <img src="http://i252.photobucket.com/albums/hh15/liveyourlife815/stripes-1.png" class="main-img" alt="footer"> 
          </div> 
         </div> 
        </div> 
      </div> 
     </body> 
    </html> 
http://jsfiddle.net/Q9EEv/9/

絕對元件是條帶，所以我想它背的是，相對圖像上。

感謝

來源

2014-02-17 MZH

使用'z-index'爲它 –

z-index在position：relative;元素 –

它將適用於'相對，絕對，固定'。但在靜態情況下不起作用 –

在這裏你去：http://jsfiddle.net/Q9EEv/10/

.content-b img 
{ 
    position: relative; 
}

你解決了這個問題你的自我。但是z-index對每個定位元素都有效（不是靜態的）。

來源

2014-02-17 17:41:30

位置絕對元素前面的相對元素CSS

回答

相關問題