JSFiddle - React, Tailwind, and code Playground

by Gabriele Petrioli

HTML

<div class="container">
        contents
</div>

CSS

body{background-color:green;}
.container{
    position: relative;
    z-index:1;
    width:100px;
    height:100px;
    margin:30px;
    border:1px solid red;
    overflow:hidden;
    color:red;
}
.container:before{
    id:'test';
    z-index:-1;
    position:absolute;
    width:100px;
    height:100px;
    left:0;
    top:0;
    content: url('http://lorempixel.com/100/100/sports/7/');
    opacity:0.4
}
.container:hover:before{
    opacity:1;
}