将鼠标悬停在另一个div上更改不透明度

Question

想通过使另两个透明，使悬停一个突出。 但是他们使用的是同一类，不知道这可能吗？

$sql= mysqli_query($conn, 
          "select from tables where username=$username and status='1' ") ;

$row=mysqli_query($conn, $sql) ;

.regcard{
  transition: opacity 0.5s;
}

.regcard:hover ~ .standout{ 
  opacity: 0.5;
  background:green; } 

Answer 1

只要您的物品具有共同的祖先：

.regcard {
  transition: opacity 0.5s;
}

/* Fade all items when parent is hovered */
.items:hover .regcard {
  opacity: 0.5;
}

/* Un-fade the hovered item */
.items .regcard:hover {
  opacity: 1;
}

<div class="items">
  <div class="item">
    <a href="#" target="_blank" class="standout">
      <div class="regcard cardlist">
        number 1
      </div>
    </a>
  </div>

  <div class="item">
    <a href="#" target="_blank" class="standout">
      <div class="regcard cardlist">
        number 2
      </div>
    </a>
  </div>

  <div class="item">
    <a href="#" target="_blank" class="standout">
      <div class="regcard cardlist">
        number 3
      </div>
    </a>
  </div>
</div>