opacity siblings

by minxs

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css">
<script src="//cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
<ul>
  <li><img src="//picsum.photos/200/200/?random&1"></li>
   <li><img src="//picsum.photos/200/200/?random&2"></li>
    <li><img src="//picsum.photos/200/200/?random&3"></li>
</ul>

CSS

ul:hover li:not(:hover){ opacity:.3}