JSFiddle - React, Tailwind, and code Playground

by GlauberRocha

HTML

<a href="#">
    <div>
        <div>
        </div>
    </div>
</a>

CSS

a {
    width: 200px; height: 150px;
    display: block;
    border: solid 3px white;
}

a:hover {    
    border-color: red;
}

a > div {
    opacity: .5;
}

a > div:hover {
    opacity: 1;
}

a > div > div {
    width: 200px; height: 150px;
    background-image: url("http://www.cinematheque.fr/data/home/images/expositions.jpg");
}