悬停对象，更改主背景

Question

出于某种原因无法想出这个。这是一个基本的例子。将鼠标悬停在深div上时需要更改主背景（在本例中为p“1”）。

main {
  background: yellow;
}

.change:hover ~ main {
  background: blue;
}

<main>
  <div>
    <p class="change">
      1
    </p>
    <p>
      2 </p>
    <p>
      3 </p>
  </div>
</main>