Efecto hover en etiquetas hermanas

codi.link Copiar

    
<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
</ul>

<style>

ul:hover > :not(:hover) {
  opacity: 0.5;
}

</style>