Block html et css

Bonjour,

je souhaite créer un block de ce style.
lorsque je passe la souris dessus le fond devient plus opaque et le texte change.

Pourriez vous m'aider je ne sais pa si cela est possible en html et css.

merci

voici mon code html

<div class="row">
<div class="col-sm-4 col-md-3" ng-mouseover="hoverIn()" ng-mouseleave="hoverOut()">
<a ng-href="url" class="panel-body panel-info">
<div class="overflow2">
<h3 class="m-t-none m-b-xs">
<table>
<tr>
<td >TITRE</td>
</tr>
</table>
</h3>
<div class="text-muted item-short-desc">
DESCRIPTION
</div>
</div>
</a>
</div>
</div>

Par exemple pour une rangée dans un tableau tu peux faire :

tr:hover { background-color: #444; }

Voir avec ton moteur de recherche préféré : "css hover"
Modifié par bazooka07 (08 Nov 2019 - 21:08)