如何在僅有一個Ddiv時將背景圖像置於前面

我有一張帶有下面代碼背景圖像的畫布。我怎樣才能把背景圖像帶到前面只用css？圖像應該放在畫布的前面。如何在僅有一個Ddiv時將背景圖像置於前面

.dvContainer { 
 
opacity: .7; 
 
z-index:-100; 
 
} 
 
.background { 
 
background-repeat: no-repeat; 
 
background-image:url(https://i.imgur.com/ITWfejd.png); 
 
background-position: center; 
 
}

<div> 
 
    <canvas id="myCanvas" class="dvContainer background" width="400" height="300" 
 
    style="background-color: red;"> 
 
    </canvas> 
 
</div>

來源

2017-09-02 david

你已經改變了，現在的問題：d你可能無法在面前提起背景...... z-index的贏得了」在這裏幫助......你爲什麼首先需要這個？ – kukkuz

我只有一個div，只能在canvas中使用邏輯 – david

這樣做： -

.dvContainer { 
    opacity: .7; 
    z-index:1001; 
    display:none; 
    } 

    .background { 
    background-repeat: no-repeat; 
    background-image:url(https://i.imgur.com/ITWfejd.png); 
    background-position: center; 
    } 

    <div> 
     <canvas id="myCanvas" class="dvContainer background" width="400" height="300" 
     style="background-color: red;"> 
     </canvas> 
    </div>

，並將該Div Element在頁面的頂部。

這將定位格在上面，如果不是發生試圖在z-index的共增加

來源

2017-09-02 13:05:20

單獨增加'z-index'不會在*堆疊上下文中將* parent *放在* child *之上*，你試過了嗎？ – kukkuz

是@kukkuz，每次工作。 –

但是我還有一件事要在你指出的答案中編輯。 –

如何在僅有一個Ddiv時將背景圖像置於前面

回答

相關問題