Comment mettre l'image de fond à l'avant quand dans un seul Ddiv

Question

J'ai une toile avec une image de fond avec le code ci-dessous. Comment puis-je amener l'image de fond à l'avant avec juste css? L'image devrait venir devant la toile.

.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>

Answer 1

Faites ceci: -

.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> 

et mettez-Div Element en haut de la page.

Cette localisera la div sur si ne se produit pas essayer d'augmenter dans z-index