悬停文字使Div更改颜色 - CSS

Question

在文本悬停时，我无法制作div更改背景色。

我正在使用div.book的绝对位置，文本的绝对值超过它，因此文本悬停在div上，z-index 3上的文本和2上的div。

当我悬停div时，整个背景会发生变化，但是文字覆盖了大部分div，当它悬停时没有任何变化，所以我尝试了：

＆＃13;

＆＃13;

h1:hover + div.book {
  background-color: rgba(333, 33, 33, 1);
}

.book {
  height: 50px;
  }

＆＃13;

<h1>Book</h1> 
<div class="book"></div>

＆＃13;

＆＃13;

＆＃13;

但我似乎无法让它发挥作用？

任何想法？

提前致谢！

Answer 1

将<div></div>放在.book内。这两个元素现在将相互重叠。将宽度添加到h1:hover { background: red; color: rgba(0, 0, 0, 0); } .book { height: 50px; width: 200px; }。最后将颜色（= textcolor）设置为透明，这样就不会显示任何字母。

＆＃13;

＆＃13;

<div class="book">
  <h1>Book</h1> 
</div>

＆＃13;

{{1}}

＆＃13;

＆＃13;

＆＃13;